diff --git a/apps/daffio/src/app/core/header/components/header.module.ts b/apps/daffio/src/app/core/header/components/header.module.ts
index 0169abfc43..dc6cf7451c 100644
--- a/apps/daffio/src/app/core/header/components/header.module.ts
+++ b/apps/daffio/src/app/core/header/components/header.module.ts
@@ -2,8 +2,8 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffContainerModule } from '@daffodil/design/container';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { DaffioHeaderComponent } from './header/header.component';
 import { DaffioHeaderItemDirective } from './header-item/header-item.directive';
diff --git a/apps/daffio/src/app/core/header/components/header/header.component.spec.ts b/apps/daffio/src/app/core/header/components/header/header.component.spec.ts
index 2384e402a6..541856594b 100644
--- a/apps/daffio/src/app/core/header/components/header/header.component.spec.ts
+++ b/apps/daffio/src/app/core/header/components/header/header.component.spec.ts
@@ -5,8 +5,8 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffContainerModule } from '@daffodil/design/container';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { DaffioHeaderComponent } from './header.component';
 
diff --git a/apps/demo/src/app/core/header/components/header/header.component.spec.ts b/apps/demo/src/app/core/header/components/header/header.component.spec.ts
index 8bb9aa483e..1be39fbdcd 100644
--- a/apps/demo/src/app/core/header/components/header/header.component.spec.ts
+++ b/apps/demo/src/app/core/header/components/header/header.component.spec.ts
@@ -7,7 +7,7 @@ import { By } from '@angular/platform-browser';
 import { Router } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 
-import { DaffNavbarModule } from '@daffodil/design';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { DemoHeaderComponent } from './header.component';
 
diff --git a/apps/demo/src/app/core/header/header.module.ts b/apps/demo/src/app/core/header/header.module.ts
index 5751244afc..83c3921931 100644
--- a/apps/demo/src/app/core/header/header.module.ts
+++ b/apps/demo/src/app/core/header/header.module.ts
@@ -3,8 +3,8 @@ import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { DemoHeaderComponent } from './components/header/header.component';
 import { DemoHeaderContainer } from './containers/header/header.component';
diff --git a/apps/design-land/src/app/app.module.ts b/apps/design-land/src/app/app.module.ts
index e636904ae8..2db829d002 100644
--- a/apps/design-land/src/app/app.module.ts
+++ b/apps/design-land/src/app/app.module.ts
@@ -4,13 +4,11 @@ import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
-import {
-  DAFF_THEME_INITIALIZER,
-  DaffNavbarModule,
-} from '@daffodil/design';
+import { DAFF_THEME_INITIALIZER } from '@daffodil/design';
 import { DaffArticleModule } from '@daffodil/design/article';
 import { DaffButtonModule } from '@daffodil/design/button';
 import { DaffLinkSetModule } from '@daffodil/design/link-set';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 import { DaffThemeSwitchButtonModule } from '@daffodil/theme-switch';
 
diff --git a/apps/design-land/src/app/core/sidebar-viewport/sidebar-viewport.module.ts b/apps/design-land/src/app/core/sidebar-viewport/sidebar-viewport.module.ts
index c6aa912ceb..2aa26834ea 100644
--- a/apps/design-land/src/app/core/sidebar-viewport/sidebar-viewport.module.ts
+++ b/apps/design-land/src/app/core/sidebar-viewport/sidebar-viewport.module.ts
@@ -4,9 +4,9 @@ import { RouterModule } from '@angular/router';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
 import { DaffLogoModule } from '@daffodil/branding';
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffArticleModule } from '@daffodil/design/article';
 import { DaffButtonModule } from '@daffodil/design/button';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 import { DaffThemeSwitchButtonModule } from '@daffodil/theme-switch';
 
diff --git a/apps/design-land/src/app/navbar/navbar.module.ts b/apps/design-land/src/app/navbar/navbar.module.ts
index f30bf40ce4..bd0be04d77 100644
--- a/apps/design-land/src/app/navbar/navbar.module.ts
+++ b/apps/design-land/src/app/navbar/navbar.module.ts
@@ -2,8 +2,8 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffArticleModule } from '@daffodil/design/article';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { DesignLandNavbarRoutingModule } from './navbar-routing.module';
 import { DesignLandNavbarComponent } from './navbar.component';
diff --git a/libs/design/src/molecules/navbar/README.md b/libs/design/navbar/README.md
similarity index 100%
rename from libs/design/src/molecules/navbar/README.md
rename to libs/design/navbar/README.md
diff --git a/libs/design/navbar/examples/src/basic-navbar/basic-navbar.module.ts b/libs/design/navbar/examples/src/basic-navbar/basic-navbar.module.ts
index 25bd177343..b03a8ed781 100644
--- a/libs/design/navbar/examples/src/basic-navbar/basic-navbar.module.ts
+++ b/libs/design/navbar/examples/src/basic-navbar/basic-navbar.module.ts
@@ -1,9 +1,9 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
 import { DaffContainerModule } from '@daffodil/design/container';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { BasicNavbarComponent } from './basic-navbar.component';
 
diff --git a/libs/design/navbar/examples/src/contained-navbar/contained-navbar.module.ts b/libs/design/navbar/examples/src/contained-navbar/contained-navbar.module.ts
index 05fe659428..006bccab54 100644
--- a/libs/design/navbar/examples/src/contained-navbar/contained-navbar.module.ts
+++ b/libs/design/navbar/examples/src/contained-navbar/contained-navbar.module.ts
@@ -1,9 +1,9 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
 import { DaffContainerModule } from '@daffodil/design/container';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { ContainedNavbarComponent } from './contained-navbar.component';
 
diff --git a/libs/design/navbar/examples/src/navbar-theming/navbar-theming.module.ts b/libs/design/navbar/examples/src/navbar-theming/navbar-theming.module.ts
index 4e1a940734..d22ef766c1 100644
--- a/libs/design/navbar/examples/src/navbar-theming/navbar-theming.module.ts
+++ b/libs/design/navbar/examples/src/navbar-theming/navbar-theming.module.ts
@@ -2,8 +2,8 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { NavbarThemingComponent } from './navbar-theming.component';
 
diff --git a/libs/design/navbar/examples/src/raised-navbar/raised-navbar.module.ts b/libs/design/navbar/examples/src/raised-navbar/raised-navbar.module.ts
index 33eac6c1de..2bd92bf245 100644
--- a/libs/design/navbar/examples/src/raised-navbar/raised-navbar.module.ts
+++ b/libs/design/navbar/examples/src/raised-navbar/raised-navbar.module.ts
@@ -1,8 +1,8 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 
 import { RaisedNavbarComponent } from './raised-navbar.component';
 
diff --git a/libs/design/navbar/ng-package.json b/libs/design/navbar/ng-package.json
new file mode 100644
index 0000000000..9e6e8ced7c
--- /dev/null
+++ b/libs/design/navbar/ng-package.json
@@ -0,0 +1,9 @@
+{
+  "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/design/navbar",
+  "deleteDestPath": false,
+  "lib": {
+    "entryFile": "src/index.ts",
+    "styleIncludePaths": ["../src/scss"]
+  }
+} 
\ No newline at end of file
diff --git a/libs/design/navbar/src/index.ts b/libs/design/navbar/src/index.ts
new file mode 100644
index 0000000000..4aaf8f92ed
--- /dev/null
+++ b/libs/design/navbar/src/index.ts
@@ -0,0 +1 @@
+export * from './public_api';
diff --git a/libs/design/src/molecules/navbar/navbar-theme.scss b/libs/design/navbar/src/navbar-theme.scss
similarity index 95%
rename from libs/design/src/molecules/navbar/navbar-theme.scss
rename to libs/design/navbar/src/navbar-theme.scss
index b8e2395ced..3b36a712fd 100644
--- a/libs/design/src/molecules/navbar/navbar-theme.scss
+++ b/libs/design/navbar/src/navbar-theme.scss
@@ -1,6 +1,6 @@
 @use 'sass:map';
-@use '../../../scss/core';
-@use '../../../scss/theming';
+@use '../../scss/core';
+@use '../../scss/theming';
 
 @mixin daff-navbar-theme-variant($color) {
 	background: $color;
diff --git a/libs/design/src/molecules/navbar/navbar.module.ts b/libs/design/navbar/src/navbar.module.ts
similarity index 73%
rename from libs/design/src/molecules/navbar/navbar.module.ts
rename to libs/design/navbar/src/navbar.module.ts
index c3139ef696..7ca6a176b0 100644
--- a/libs/design/src/molecules/navbar/navbar.module.ts
+++ b/libs/design/navbar/src/navbar.module.ts
@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarComponent } from './navbar.component';
+import { DaffNavbarComponent } from './navbar/navbar.component';
 
 @NgModule({
   declarations: [
diff --git a/libs/design/src/molecules/navbar/navbar.component.scss b/libs/design/navbar/src/navbar/navbar.component.scss
similarity index 100%
rename from libs/design/src/molecules/navbar/navbar.component.scss
rename to libs/design/navbar/src/navbar/navbar.component.scss
diff --git a/libs/design/src/molecules/navbar/navbar.component.spec.ts b/libs/design/navbar/src/navbar/navbar.component.spec.ts
similarity index 96%
rename from libs/design/src/molecules/navbar/navbar.component.spec.ts
rename to libs/design/navbar/src/navbar/navbar.component.spec.ts
index a0c2c388f9..99d3e1ecbc 100644
--- a/libs/design/src/molecules/navbar/navbar.component.spec.ts
+++ b/libs/design/navbar/src/navbar/navbar.component.spec.ts
@@ -9,8 +9,9 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 
+import { DaffPalette } from '@daffodil/design';
+
 import { DaffNavbarComponent } from './navbar.component';
-import { DaffPalette } from '../../core/colorable/public_api';
 
 @Component({ template: '<nav daff-navbar [color]="color" [raised]="raised"></ nav>' })
 class WrapperComponent {
diff --git a/libs/design/src/molecules/navbar/navbar.component.ts b/libs/design/navbar/src/navbar/navbar.component.ts
similarity index 90%
rename from libs/design/src/molecules/navbar/navbar.component.ts
rename to libs/design/navbar/src/navbar/navbar.component.ts
index f83bf5512d..7aaddd1a33 100644
--- a/libs/design/src/molecules/navbar/navbar.component.ts
+++ b/libs/design/navbar/src/navbar/navbar.component.ts
@@ -10,8 +10,8 @@ import {
 import {
   DaffColorable,
   daffColorMixin,
-} from '../../core/colorable/public_api';
-import { daffManageContainerLayoutMixin } from '../../core/manage-container-layout/public_api';
+  daffManageContainerLayoutMixin,
+} from '@daffodil/design';
 
 /**
  * An _elementRef is needed for the Colorable mixin
diff --git a/libs/design/src/molecules/navbar/public_api.ts b/libs/design/navbar/src/public_api.ts
similarity index 54%
rename from libs/design/src/molecules/navbar/public_api.ts
rename to libs/design/navbar/src/public_api.ts
index 988d541661..b491029786 100644
--- a/libs/design/src/molecules/navbar/public_api.ts
+++ b/libs/design/navbar/src/public_api.ts
@@ -1,2 +1,2 @@
 export { DaffNavbarModule } from './navbar.module';
-export * from './navbar.component';
+export * from './navbar/navbar.component';
diff --git a/libs/design/scss/theme.scss b/libs/design/scss/theme.scss
index b40c929c56..7167e04c38 100644
--- a/libs/design/scss/theme.scss
+++ b/libs/design/scss/theme.scss
@@ -34,7 +34,7 @@
 @use '../media-gallery/src/media-gallery-theme' as media-gallery;
 @use '../menu/src/menu-theme' as menu;
 @use '../modal/src/modal-theme' as modal;
-@use '../src/molecules/navbar/navbar-theme' as navbar;
+@use '../navbar/src/navbar-theme' as navbar;
 @use '../notification/src/notification-theme' as notification;
 @use '../src/molecules/paginator/paginator-theme' as paginator;
 @use '../sidebar/src/sidebar-theme' as sidebar;
diff --git a/libs/design/sidebar/examples/src/basic-sidebar/basic-sidebar.module.ts b/libs/design/sidebar/examples/src/basic-sidebar/basic-sidebar.module.ts
index bf4ccfd18f..a1ebc58adc 100644
--- a/libs/design/sidebar/examples/src/basic-sidebar/basic-sidebar.module.ts
+++ b/libs/design/sidebar/examples/src/basic-sidebar/basic-sidebar.module.ts
@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffLinkSetModule } from '@daffodil/design/link-set';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 
 import { BasicSidebarComponent } from './basic-sidebar.component';
diff --git a/libs/design/sidebar/examples/src/over-and-under-sidebars/over-and-under-sidebars.module.ts b/libs/design/sidebar/examples/src/over-and-under-sidebars/over-and-under-sidebars.module.ts
index 99679a5a22..6bf82e11e2 100644
--- a/libs/design/sidebar/examples/src/over-and-under-sidebars/over-and-under-sidebars.module.ts
+++ b/libs/design/sidebar/examples/src/over-and-under-sidebars/over-and-under-sidebars.module.ts
@@ -2,9 +2,9 @@ import { NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
-import { DaffNavbarModule } from '@daffodil/design';
 import { DaffButtonModule } from '@daffodil/design/button';
 import { DaffLinkSetModule } from '@daffodil/design/link-set';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 
 import { OverandUnderSidebarsComponent } from './over-and-under-sidebars.component';
diff --git a/libs/design/sidebar/examples/src/side-fixed-sidebar/side-fixed-sidebar.module.ts b/libs/design/sidebar/examples/src/side-fixed-sidebar/side-fixed-sidebar.module.ts
index f23e6e4360..d99a4d3f82 100644
--- a/libs/design/sidebar/examples/src/side-fixed-sidebar/side-fixed-sidebar.module.ts
+++ b/libs/design/sidebar/examples/src/side-fixed-sidebar/side-fixed-sidebar.module.ts
@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 
 import { SideFixedSidebarComponent } from './side-fixed-sidebar.component';
diff --git a/libs/design/sidebar/examples/src/sidebar-with-sticky-content/sidebar-with-sticky-content.module.ts b/libs/design/sidebar/examples/src/sidebar-with-sticky-content/sidebar-with-sticky-content.module.ts
index 8a6af7a8b1..73145e8e5a 100644
--- a/libs/design/sidebar/examples/src/sidebar-with-sticky-content/sidebar-with-sticky-content.module.ts
+++ b/libs/design/sidebar/examples/src/sidebar-with-sticky-content/sidebar-with-sticky-content.module.ts
@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 
-import { DaffNavbarModule } from '@daffodil/design';
+import { DaffNavbarModule } from '@daffodil/design/navbar';
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
 
 import { SidebarWithStickyContentComponent } from './sidebar-with-sticky-content.component';
diff --git a/libs/design/src/public_api.ts b/libs/design/src/public_api.ts
index 576c3450af..b5da74ead6 100644
--- a/libs/design/src/public_api.ts
+++ b/libs/design/src/public_api.ts
@@ -19,7 +19,6 @@ export * from './molecules/backdrop/public_api';
 export * from './molecules/button-set/public_api';
 export * from './molecules/image-gallery/public_api';
 export * from './molecules/image-list/public_api';
-export * from './molecules/navbar/public_api';
 export * from './molecules/paginator/public_api';
 export * from './molecules/qty-dropdown/public_api';
 export * from './molecules/feature/public_api';