diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts
index b912d4c9..a05af72f 100644
--- a/docs/.vitepress/config.mts
+++ b/docs/.vitepress/config.mts
@@ -1,3 +1,6 @@
+import type MarkdownIt from 'markdown-it'
+import type StateBlock from 'markdown-it/lib/rules_block/state_block'
+
 import { URL, fileURLToPath } from 'node:url'
 import { resolve } from 'path'
 
@@ -172,5 +175,42 @@ export default defineConfig({
     }
   },
 
-  ignoreDeadLinks: true
+  ignoreDeadLinks: true,
+
+  markdown: {
+    config: (md) => {
+      md.use(discordBannerPlugin);
+    },
+  }
 })
+
+// Custom Markdown-it plugin
+function discordBannerPlugin(md: MarkdownIt) {
+  const marker = '[ discord banner ]'
+
+  md.block.ruler.before(
+    'fence',
+    'discord-banner',
+    (state: StateBlock, startLine: number, endLine: number, silent: boolean): boolean => {
+    const start = state.bMarks[startLine] + state.tShift[startLine];
+    const max = state.eMarks[startLine];
+
+    // Match the custom marker
+    if (state.src.slice(start, max).trim() !== marker) {
+      return false;
+    }
+
+    if (silent) return true;
+
+    // Create a token for the banner component
+    const token = state.push('discord-banner', 'div', 0);
+    token.map = [startLine, startLine + 1];
+    state.line = startLine + 1;
+
+    return true;
+  });
+
+  // Render the component
+  md.renderer.rules['discord-banner'] = () => '<DiscordBanner />'
+}
+
diff --git a/docs/.vitepress/theme/assets/css/tailwind.css b/docs/.vitepress/theme/assets/css/tailwind.css
index 0f952902..4ca3191f 100644
--- a/docs/.vitepress/theme/assets/css/tailwind.css
+++ b/docs/.vitepress/theme/assets/css/tailwind.css
@@ -204,6 +204,10 @@
     }
   }
 
+  .kit-button.kit-button-small {
+    font-size: 12px;
+  }
+
   .kit-button.kit-button-cornflower {
     @apply text-cornflower;
     @apply hocus:text-white hocus:bg-cornflower;
diff --git a/docs/.vitepress/theme/components/DiscordBanner.vue b/docs/.vitepress/theme/components/DiscordBanner.vue
new file mode 100644
index 00000000..8afaec29
--- /dev/null
+++ b/docs/.vitepress/theme/components/DiscordBanner.vue
@@ -0,0 +1,25 @@
+<template>
+<div class="discord-banner p-6 my-12 flex gap-6">
+  <div class="grow-0 shrink-0 basis-6">
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+      <path fill="none" d="M0 0h24v24H0z"></path><path d="M21 10.063V4C21 3.44772 20.5523 3 20 3H19C17.0214 4.97864 13.3027 6.08728 11 6.61281V17.3872C13.3027 17.9127 17.0214 19.0214 19 21H20C20.5523 21 21 20.5523 21 20V13.937C21.8626 13.715 22.5 12.9319 22.5 12 22.5 11.0681 21.8626 10.285 21 10.063ZM5 7C3.89543 7 3 7.89543 3 9V15C3 16.1046 3.89543 17 5 17H6L7 22H9V7H5Z"></path>
+    </svg>
+  </div>
+
+  <div class="flex-1 space-y-4">
+    <strong>Need help getting your ML projects to production?</strong>
+
+    <div>Talk with our team about how KitOps can help</div>
+
+    <div>
+      <button class="kit-button kit-button-small kit-button-cornflower">Join our Discord</button>
+    </div>
+  </div>
+</div>
+</template>
+
+<style>
+.discord-banner {
+  background: var(--vp-custom-block-tip-bg);
+}
+</style>
diff --git a/docs/.vitepress/theme/components/DiscordModal.vue b/docs/.vitepress/theme/components/DiscordModal.vue
deleted file mode 100644
index 9a7f2357..00000000
--- a/docs/.vitepress/theme/components/DiscordModal.vue
+++ /dev/null
@@ -1,76 +0,0 @@
-<script setup lang="ts">
-import { onBeforeUnmount, onMounted, ref } from 'vue'
-
-const ONE_DAY_MS = 1000 * 60 * 60 * 24
-const STORAGE_KEY = 'discord-modal-last-opened'
-
-const isVisible = ref(false)
-
-const close = () => {
-  isVisible.value  = false
-  localStorage.setItem(STORAGE_KEY, String(new Date().getTime()))
-}
-
-onMounted(() => {
-  const now = new Date().getTime()
-
-  // get the last time we showed the modal, or 1 day ago if it's not set yet
-  const lastOpenedAt = localStorage.getItem(STORAGE_KEY) || now - ONE_DAY_MS
-  const lastOpenedTime = new Date(Number(lastOpenedAt)).getTime()
-  const lastOpenDiff = now - lastOpenedTime
-
-  // show the modal once a day only
-  if (lastOpenDiff >= ONE_DAY_MS) {
-    // Show the modal 5 seconds after the page load
-    setTimeout(() => {
-      isVisible.value = true
-    }, 5000)
-  }
-})
-
-onBeforeUnmount(() => {
-  // Only call `close` if the `isVisible` is true, to prevent updating `localStorage` timestamp
-  if (isVisible.value) {
-    close()
-  }
-})
-</script>
-
-<template>
-<Teleport to="body">
-  <div v-if="isVisible" class="z-10 fixed inset-0 flex items-center justify-center bg-black bg-opacity-40">
-    <div class="bg-elevation-02 p-6 lg:p-12 max-w-[800px]">
-      <header class="flex items-start mb-6 relative">
-        <button class="absolute right-0 top-0" @click="close()">
-          <span class="sr-only">close this modal</span>
-          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
-            <path d="M12.0007 10.5865L16.9504 5.63672L18.3646 7.05093L13.4149 12.0007L18.3646 16.9504L16.9504 18.3646L12.0007 13.4149L7.05093 18.3646L5.63672 16.9504L10.5865 12.0007L5.63672 7.05093L7.05093 5.63672L12.0007 10.5865Z" fill="#ECECEC"/>
-          </svg>
-        </button>
-      </header>
-
-      <h4 class="text-center mb-10 mt-10">Need help getting your ML projects to production?</h4>
-
-      <h3 class="text-center max-w-[400px] mx-auto">
-        Talk with our team about how KitOps can help
-      </h3>
-
-      <div class="flex justify-center items-center">
-        <a href="https://discord.gg/Tapeh8agYy" target="_blank" class="kit-button kit-button-gold text-center mt-10 mx-auto inline-block w-max">
-          Say hello
-        </a>
-      </div>
-    </div>
-  </div>
-</Teleport>
-</template>
-
-<style scoped>
-.input {
-    @apply border border-off-white text-off-white;
-    @apply focus:border-gold;
-    @apply placeholder:text-gray-05 placeholder:opacity-100;
-    @apply block px-4 py-2 flex-1 bg-transparent w-full;
-    @apply outline-none focus:!outline-none;
-  }
-</style>
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
index 5f876a4b..bb32ece1 100644
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -5,10 +5,10 @@ import DefaultTheme from 'vitepress/theme'
 import PlatformSelect from './components/PlatformSelect.vue'
 import PlatformSnippet from './components/PlatformSnippet.vue'
 import GithubStartButton from './components/GithubStartButton.vue'
+import DiscordBanner from './components/DiscordBanner.vue'
 import './assets/css/fonts.css'
 import './assets/css/tailwind.css'
 import './style.css'
-import DiscordModal from './components/DiscordModal.vue'
 
 const isPlatformModalOpen = ref(false)
 
@@ -33,11 +33,11 @@ export default {
       'nav-bar-content-after': () => h(GithubStartButton, {
         class: 'ml-4 pt-2'
       }),
-      'doc-bottom': () => h(DiscordModal)
     })
   },
   enhanceApp({ app, router, siteData }) {
     app.component('PlatformSnippet', PlatformSnippet)
     app.provide('isPlatformModalOpen', isPlatformModalOpen)
+    app.component('DiscordBanner', DiscordBanner);
   }
 } satisfies Theme
diff --git a/docs/src/docs/overview.md b/docs/src/docs/overview.md
index 2e13f013..eac2a85c 100644
--- a/docs/src/docs/overview.md
+++ b/docs/src/docs/overview.md
@@ -61,6 +61,8 @@ AI/ML projects often deal with large, unstructured datasets, such as images, vid
 
 One of the core strengths of KitOps is its ability to keep data and code versions in sync. This crucial feature solves the reproducibility issues that frequently arise in AI/ML development, ensuring consistency and reliability across project stages.
 
+[ discord banner ]
+
 ### 🚀 Deployment Ready
 
 Designed with a focus on deployment, ModelKits package assets in standard formats so you can depoly them as [containers or to Kubernetes](./deploy.md). They're also [compatible with nearly any tool](./modelkit/compatibility.md) - helping you get your model to production faster and more efficiently.