diff --git a/docs/docs/examples/_category_.json b/docs/docs/examples/_category_.json
deleted file mode 100644
index 8e1b5f4b..00000000
--- a/docs/docs/examples/_category_.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "label": "Examples",
-    "position": 2,
-    "link": {
-        
-    }
-}
\ No newline at end of file
diff --git a/docs/docs/guide/containers/_category_.json b/docs/docs/guide/containers/_category_.json
deleted file mode 100644
index df6be5e6..00000000
--- a/docs/docs/guide/containers/_category_.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-    "label": "Containers",
-    "position": 1,
-    "link": { "type": "doc", "id": "guide/containers/introduction" }
-  }
\ No newline at end of file
diff --git a/docs/docs/guide/services/_category_.json b/docs/docs/guide/services/_category_.json
deleted file mode 100644
index 2e4712cc..00000000
--- a/docs/docs/guide/services/_category_.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-    "label": "Services",
-    "position": 2,
-    "link": { "type": "doc", "id": "guide/services/introduction" }
-  }
\ No newline at end of file
diff --git a/docs/docs/guide/tokens/_category_.json b/docs/docs/guide/tokens/_category_.json
deleted file mode 100644
index e4118099..00000000
--- a/docs/docs/guide/tokens/_category_.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-    "label": "Tokens",
-    "position": 2,
-    "link": { "type": "doc", "id": "guide/tokens/introduction" }
-  }
\ No newline at end of file
diff --git a/docs/docs/getting-started.mdx b/docs/docs/tutorial/getting-started.mdx
similarity index 100%
rename from docs/docs/getting-started.mdx
rename to docs/docs/tutorial/getting-started.mdx
diff --git a/docs/docs/guide/_category_.json b/docs/docs/tutorial/guide/_category_.json
similarity index 100%
rename from docs/docs/guide/_category_.json
rename to docs/docs/tutorial/guide/_category_.json
diff --git a/docs/docs/tutorial/guide/containers/_category_.json b/docs/docs/tutorial/guide/containers/_category_.json
new file mode 100644
index 00000000..3774cd09
--- /dev/null
+++ b/docs/docs/tutorial/guide/containers/_category_.json
@@ -0,0 +1,5 @@
+{
+    "label": "Containers",
+    "position": 1,
+    "link": { "type": "doc", "id": "tutorial/guide/containers/introduction" }
+  }
\ No newline at end of file
diff --git a/docs/docs/guide/containers/creating-containers.md b/docs/docs/tutorial/guide/containers/creating-containers.md
similarity index 100%
rename from docs/docs/guide/containers/creating-containers.md
rename to docs/docs/tutorial/guide/containers/creating-containers.md
diff --git a/docs/docs/guide/containers/custom-containers.md b/docs/docs/tutorial/guide/containers/custom-containers.md
similarity index 100%
rename from docs/docs/guide/containers/custom-containers.md
rename to docs/docs/tutorial/guide/containers/custom-containers.md
diff --git a/docs/docs/guide/containers/introduction.mdx b/docs/docs/tutorial/guide/containers/introduction.mdx
similarity index 100%
rename from docs/docs/guide/containers/introduction.mdx
rename to docs/docs/tutorial/guide/containers/introduction.mdx
diff --git a/docs/docs/guide/es-decorators.md b/docs/docs/tutorial/guide/es-decorators.md
similarity index 100%
rename from docs/docs/guide/es-decorators.md
rename to docs/docs/tutorial/guide/es-decorators.md
diff --git a/docs/docs/guide/react/_category_.json b/docs/docs/tutorial/guide/react/_category_.json
similarity index 55%
rename from docs/docs/guide/react/_category_.json
rename to docs/docs/tutorial/guide/react/_category_.json
index ccca5813..43f55890 100644
--- a/docs/docs/guide/react/_category_.json
+++ b/docs/docs/tutorial/guide/react/_category_.json
@@ -1,6 +1,6 @@
 {
     "label": "React Bindings",
     "position": 3,
-    "link": { "type": "doc", "id": "guide/react/introduction" },
+    "link": { "type": "doc", "id": "tutorial/guide/react/introduction" },
     "className": "sidebar_doc_incomplete"
-  }
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/docs/docs/guide/react/introduction.md b/docs/docs/tutorial/guide/react/introduction.md
similarity index 98%
rename from docs/docs/guide/react/introduction.md
rename to docs/docs/tutorial/guide/react/introduction.md
index 5308fd76..abea8b47 100644
--- a/docs/docs/guide/react/introduction.md
+++ b/docs/docs/tutorial/guide/react/introduction.md
@@ -1,5 +1,6 @@
 ---
 sidebar_class_name: sidebar_doc_incomplete
+draft: true
 ---
 
 # React Bindings
diff --git a/docs/docs/tutorial/guide/services/_category_.json b/docs/docs/tutorial/guide/services/_category_.json
new file mode 100644
index 00000000..a26ddc07
--- /dev/null
+++ b/docs/docs/tutorial/guide/services/_category_.json
@@ -0,0 +1,5 @@
+{
+    "label": "Services",
+    "position": 2,
+    "link": { "type": "doc", "id": "tutorial/guide/services/introduction" }
+  }
\ No newline at end of file
diff --git a/docs/docs/guide/services/eager-services.md b/docs/docs/tutorial/guide/services/eager-services.md
similarity index 100%
rename from docs/docs/guide/services/eager-services.md
rename to docs/docs/tutorial/guide/services/eager-services.md
diff --git a/docs/docs/guide/services/host-container.md b/docs/docs/tutorial/guide/services/host-container.md
similarity index 100%
rename from docs/docs/guide/services/host-container.md
rename to docs/docs/tutorial/guide/services/host-container.md
diff --git a/docs/docs/guide/services/introduction.md b/docs/docs/tutorial/guide/services/introduction.md
similarity index 100%
rename from docs/docs/guide/services/introduction.md
rename to docs/docs/tutorial/guide/services/introduction.md
diff --git a/docs/docs/guide/services/multiple-services.md b/docs/docs/tutorial/guide/services/multiple-services.md
similarity index 100%
rename from docs/docs/guide/services/multiple-services.md
rename to docs/docs/tutorial/guide/services/multiple-services.md
diff --git a/docs/docs/guide/services/resolution-constraints.mdx b/docs/docs/tutorial/guide/services/resolution-constraints.mdx
similarity index 100%
rename from docs/docs/guide/services/resolution-constraints.mdx
rename to docs/docs/tutorial/guide/services/resolution-constraints.mdx
diff --git a/docs/docs/guide/services/singletons.md b/docs/docs/tutorial/guide/services/singletons.md
similarity index 100%
rename from docs/docs/guide/services/singletons.md
rename to docs/docs/tutorial/guide/services/singletons.md
diff --git a/docs/docs/guide/services/transient-services.mdx b/docs/docs/tutorial/guide/services/transient-services.mdx
similarity index 100%
rename from docs/docs/guide/services/transient-services.mdx
rename to docs/docs/tutorial/guide/services/transient-services.mdx
diff --git a/docs/docs/guide/services/usage-in-javascript.md b/docs/docs/tutorial/guide/services/usage-in-javascript.md
similarity index 100%
rename from docs/docs/guide/services/usage-in-javascript.md
rename to docs/docs/tutorial/guide/services/usage-in-javascript.md
diff --git a/docs/docs/tutorial/guide/tokens/_category_.json b/docs/docs/tutorial/guide/tokens/_category_.json
new file mode 100644
index 00000000..e7eb7f14
--- /dev/null
+++ b/docs/docs/tutorial/guide/tokens/_category_.json
@@ -0,0 +1,5 @@
+{
+    "label": "Tokens",
+    "position": 2,
+    "link": { "type": "doc", "id": "tutorial/guide/tokens/introduction" }
+  }
\ No newline at end of file
diff --git a/docs/docs/guide/tokens/introduction.md b/docs/docs/tutorial/guide/tokens/introduction.md
similarity index 100%
rename from docs/docs/guide/tokens/introduction.md
rename to docs/docs/tutorial/guide/tokens/introduction.md
diff --git a/docs/docs/meta/_category_.json b/docs/docs/tutorial/meta/_category_.json
similarity index 100%
rename from docs/docs/meta/_category_.json
rename to docs/docs/tutorial/meta/_category_.json
diff --git a/docs/docs/meta/code-of-conduct.md b/docs/docs/tutorial/meta/code-of-conduct.md
similarity index 100%
rename from docs/docs/meta/code-of-conduct.md
rename to docs/docs/tutorial/meta/code-of-conduct.md
diff --git a/docs/docs/meta/contributing.md b/docs/docs/tutorial/meta/contributing.md
similarity index 100%
rename from docs/docs/meta/contributing.md
rename to docs/docs/tutorial/meta/contributing.md
diff --git a/docs/docs/meta/license.md b/docs/docs/tutorial/meta/license.md
similarity index 100%
rename from docs/docs/meta/license.md
rename to docs/docs/tutorial/meta/license.md
diff --git a/docs/docs/migration/_category_.json b/docs/docs/tutorial/migration/_category_.json
similarity index 100%
rename from docs/docs/migration/_category_.json
rename to docs/docs/tutorial/migration/_category_.json
diff --git a/docs/docs/migration/migrating-from-upstream-typedi.md b/docs/docs/tutorial/migration/migrating-from-upstream-typedi.md
similarity index 87%
rename from docs/docs/migration/migrating-from-upstream-typedi.md
rename to docs/docs/tutorial/migration/migrating-from-upstream-typedi.md
index 6d6953f4..f3561e14 100644
--- a/docs/docs/migration/migrating-from-upstream-typedi.md
+++ b/docs/docs/tutorial/migration/migrating-from-upstream-typedi.md
@@ -1,5 +1,6 @@
 ---
 sidebar_class_name: sidebar_doc_incomplete
+draft: true
 ---
 
 # Migrating from typestack/typedi
diff --git a/docs/docs/what-is-dependency-injection.mdx b/docs/docs/what-is-dependency-injection.mdx
new file mode 100644
index 00000000..68feaa36
--- /dev/null
+++ b/docs/docs/what-is-dependency-injection.mdx
@@ -0,0 +1,5 @@
+---
+title: What is Dependency Injection?
+---
+
+Dependency Injection
\ No newline at end of file
diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js
index f5795ad8..5ab47d76 100644
--- a/docs/docusaurus.config.js
+++ b/docs/docusaurus.config.js
@@ -3,7 +3,7 @@
 // Note: type annotations allow type checking and IDEs autocompletion
 
 const lightCodeTheme = require('prism-react-renderer/themes/github');
-const darkCodeTheme = require('prism-react-renderer/themes/dracula');
+const darkCodeTheme = require('prism-react-renderer/themes/oceanicNext');
 
 /** @type {import('./src/app-config').AppConfigCustomFields} */
 const customFields = {
@@ -101,17 +101,17 @@ const config = {
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
-      announcementBar: {
-        // Not really sure what the ID does here, but guessing it's just for the DOM.
-        id: 'global_announcement',
+      // announcementBar: {
+      //   // Not really sure what the ID does here, but guessing it's just for the DOM.
+      //   id: 'global_announcement',
 
-        // Add in a disclaimer about the documentation being alpha.
-        content:
-          'This documentation is mostly complete, though lacking in some areas. Any incomplete sections are greyed out.',
+      //   // Add in a disclaimer about the documentation being alpha.
+      //   content:
+      //     'This documentation is mostly complete, though lacking in some areas. Any incomplete sections are greyed out.',
 
-        // We want to make sure people don't accidentally close it.
-        isCloseable: false,
-      },
+      //   // We want to make sure people don't accidentally close it.
+      //   isCloseable: false,
+      // },
 
       // Replace with your project's social card
       image: 'img/docusaurus-social-card.jpg',
@@ -128,6 +128,12 @@ const config = {
             position: 'left',
             label: 'Tutorial',
           },
+          {
+            type: 'docSidebar',
+            sidebarId: 'examplesSidebar',
+            position: 'left',
+            label: 'Examples'
+          },
           {
             href: customFields.changelog.link,
             label: 'Changelog',
diff --git a/docs/sidebars.js b/docs/sidebars.js
index 5d0e568a..c6aa0863 100644
--- a/docs/sidebars.js
+++ b/docs/sidebars.js
@@ -17,11 +17,18 @@ const sidebars = {
   tutorialSidebar: [
     {
       type: 'autogenerated',
-      dirName: '.',
+      dirName: 'tutorial',
       customProps: {
         collapsed: false,
       },
-    },
+    }
+  ],
+
+  examplesSidebar: [
+    {
+      type: 'autogenerated',
+      dirName: 'examples'
+    }
   ],
 
   // But you can create a sidebar manually
@@ -38,7 +45,4 @@ const sidebars = {
    */
 };
 
-// @ts-expect-error
-sidebars.tutorialSidebar.collapsed = false;
-
 module.exports = sidebars;
diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css
index cebfdd34..8e019388 100644
--- a/docs/src/css/custom.css
+++ b/docs/src/css/custom.css
@@ -6,6 +6,7 @@
 
 /* You can override the default Infima variables here. */
 :root {
+  font-size: 17px;
   --ifm-color-primary: #00569d;
   --ifm-color-primary-dark: #214067;
   --ifm-color-primary-darker: #243352;
@@ -18,31 +19,41 @@
 
   --ifm-background-color-emphasis: #ffffff;
   --ifm-background-color-emphasis-2: #ededed;
-  --ifm-navbar-background-color: rgb(208, 208, 208)!important;
+  --ifm-navbar-background-color: rgb(255, 255, 255)!important;
+  --ifm-background-color: #f3f3f3!important;
   --hero-background-color: #dfdfdf!important;
   --ifm-color-primary-light: #7e5fe4;
   --ifm-color-primary-lighter: #8e6df8;
   --ifm-color-primary-lightest: #9f82ff;
 
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  font-family: "Nimbus Sans";
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme='dark'] {
-  --ifm-color-primary: #89caff;
+  --ifm-color-primary: #9f89ff;
   --ifm-color-primary-dark: #7da5d6;
   --ifm-color-primary-darker: #6884bd;
   --ifm-color-primary-darkest: #526f9a;
-  --ifm-background-color: #262430!important;
+  --ifm-background-color: #171620!important;
   /* --ifm-background-color-emph: #343142!important; */
   --ifm-background-color-emphasis: #403c53;
   --ifm-background-color-emphasis-2: #575370;
-  --ifm-navbar-background-color: #322f40!important;
-  --hero-background-color: #2f2b3c!important;
+  --ifm-navbar-background-color: #1b1a26!important;
+  --hero-background-color: #171620!important;
   --ifm-color-primary-light: #7e5fe4;
   --ifm-color-primary-lighter: #8e6df8;
   --ifm-color-primary-lightest: #9f82ff;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
+  --ifm-navbar-shadow: 0px 0px 0px 1px rgb(65, 65, 65);
+
+  --ifm-navbar-search-input-background-color: #000000;
+
+  --ifm-alert-background-color: red!important;
+}
+
+[data-theme="dark"] .navbar__search-input {
+  border: 1px solid rgb(65, 65, 65);
 }
 
 /** Custom styles for the announcement bar. */
@@ -79,6 +90,15 @@
   border-left: 3px solid #0073ff62;
 }
 
+.menu__link--active {
+  font-weight: bold;
+}
+
+.menu__link {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
 /* Only show incomplete pages in development. */
 [data-environment="development"] .sidebar_doc_incomplete {
   opacity: 55%;
diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx
index e460ef5c..487df5af 100644
--- a/docs/src/pages/index.tsx
+++ b/docs/src/pages/index.tsx
@@ -17,7 +17,7 @@ function HomepageHeader() {
         <div className={styles.buttons}>
           <Link
             className="button button--primary button--lg"
-            to="/docs/getting-started">
+            to="/docs/tutorial/getting-started">
             Getting Started
           </Link>
           <Link