diff --git a/apps/www/.vitepress/theme/components/Announcement.vue b/apps/www/.vitepress/theme/components/Announcement.vue
new file mode 100644
index 00000000..83e1412e
--- /dev/null
+++ b/apps/www/.vitepress/theme/components/Announcement.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+import { announcementConfig } from '../config/site'
+import ArrowRightIcon from '~icons/radix-icons/arrow-right'
+</script>
+
+<template>
+  <a
+    :href="announcementConfig.link"
+    class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
+  >
+    {{ announcementConfig.icon }} <Separator class="mx-2 h-4" orientation="vertical" />
+    <span class="sm:hidden">{{ announcementConfig.title }}</span>
+    <span class="hidden sm:inline">
+      {{ announcementConfig.title }}
+    </span>
+    <ArrowRightIcon class="ml-1 h-4 w-4" />
+  </a>
+</template>
diff --git a/apps/www/.vitepress/theme/components/Blocks.vue b/apps/www/.vitepress/theme/components/Blocks.vue
index 934650ed..e6eee172 100644
--- a/apps/www/.vitepress/theme/components/Blocks.vue
+++ b/apps/www/.vitepress/theme/components/Blocks.vue
@@ -1,15 +1,14 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
+import { ref } from 'vue'
 import PageHeader from '../components/PageHeader.vue'
 import PageHeaderHeading from '../components/PageHeaderHeading.vue'
 import PageHeaderDescription from '../components/PageHeaderDescription.vue'
 import PageAction from '../components/PageAction.vue'
-import { announcementConfig } from '../config/site'
+import Announcement from '../components/Announcement.vue'
 import BlockPreview from './BlockPreview.vue'
 import GitHubIcon from '~icons/radix-icons/github-logo'
 
 import { buttonVariants } from '@/lib/registry/new-york/ui/button'
-import { Separator } from '@/lib/registry/new-york/ui/separator'
 import { cn } from '@/lib/utils'
 
 const blocks = ref<string[]>([])
@@ -21,16 +20,7 @@ import('../../../__registry__/index').then((res) => {
 
 <template>
   <PageHeader class="page-header pb-8">
-    <a
-      :href="announcementConfig.link"
-      class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
-    >
-      {{ announcementConfig.icon }}   <Separator class="mx-2 h-4" orientation="vertical" />
-      <span class="sm:hidden">{{ announcementConfig.title }}</span>
-      <span class="hidden sm:inline">{{ announcementConfig.title }}
-      </span>
-      <!-- <ArrowRightIcon class="ml-1 h-4 w-4" /> -->
-    </a>
+    <Announcement />
     <PageHeaderHeading>Building Blocks for the Web</PageHeaderHeading>
     <PageHeaderDescription>
       Beautifully designed. Copy and paste into your apps. Open Source.
diff --git a/apps/www/.vitepress/theme/components/LandingPage.vue b/apps/www/.vitepress/theme/components/LandingPage.vue
index a5b88a17..aae8de0b 100644
--- a/apps/www/.vitepress/theme/components/LandingPage.vue
+++ b/apps/www/.vitepress/theme/components/LandingPage.vue
@@ -4,7 +4,7 @@ import PageHeaderHeading from '../components/PageHeaderHeading.vue'
 import PageHeaderDescription from '../components/PageHeaderDescription.vue'
 import PageAction from '../components/PageAction.vue'
 import ExamplesNav from '../components/ExamplesNav.vue'
-import { announcementConfig } from '../config/site'
+import Announcement from '../components/Announcement.vue'
 import GitHubIcon from '~icons/radix-icons/github-logo'
 
 import { buttonVariants } from '@/lib/registry/new-york/ui/button'
@@ -16,16 +16,7 @@ import MailExample from '@/examples/mail/Example.vue'
 
 <template>
   <PageHeader class="page-header pb-8">
-    <a
-      :href="announcementConfig.link"
-      class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
-    >
-      {{ announcementConfig.icon }}   <Separator class="mx-2 h-4" orientation="vertical" />
-      <span class="sm:hidden">{{ announcementConfig.title }}</span>
-      <span class="hidden sm:inline">{{ announcementConfig.title }}
-      </span>
-      <!-- <ArrowRightIcon class="ml-1 h-4 w-4" /> -->
-    </a>
+    <Announcement />
     <PageHeaderHeading>Build your component library.</PageHeaderHeading>
     <PageHeaderDescription>
       Beautifully designed components that you can copy and paste into your
diff --git a/apps/www/.vitepress/theme/config/site.ts b/apps/www/.vitepress/theme/config/site.ts
index b1ba1608..92a6729e 100644
--- a/apps/www/.vitepress/theme/config/site.ts
+++ b/apps/www/.vitepress/theme/config/site.ts
@@ -15,6 +15,6 @@ export const siteConfig = {
 
 export const announcementConfig = {
   icon: '✨',
-  title: 'New components!',
-  link: '/docs/components/carousel.html',
+  title: 'Introducing Blocks!',
+  link: '/blocks',
 }
diff --git a/apps/www/.vitepress/theme/layout/ExamplesLayout.vue b/apps/www/.vitepress/theme/layout/ExamplesLayout.vue
index b1252643..18b0bf78 100644
--- a/apps/www/.vitepress/theme/layout/ExamplesLayout.vue
+++ b/apps/www/.vitepress/theme/layout/ExamplesLayout.vue
@@ -4,8 +4,7 @@ import PageHeaderHeading from '../components/PageHeaderHeading.vue'
 import PageHeaderDescription from '../components/PageHeaderDescription.vue'
 import PageAction from '../components/PageAction.vue'
 import ExamplesNav from '../components/ExamplesNav.vue'
-import { announcementConfig } from '../config/site'
-import ArrowRightIcon from '~icons/radix-icons/arrow-right'
+import Announcement from '../components/Announcement.vue'
 
 import { buttonVariants } from '@/lib/registry/new-york/ui/button'
 import { Separator } from '@/lib/registry/new-york/ui/separator'
@@ -15,17 +14,7 @@ import { cn } from '@/lib/utils'
 <template>
   <div class="container relative">
     <PageHeader class="page-header pb-8">
-      <a
-        :href="announcementConfig.link"
-        class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
-      >
-        {{ announcementConfig.icon }} <Separator class="mx-2 h-4" orientation="vertical" />
-        <span class="sm:hidden">{{ announcementConfig.title }}</span>
-        <span class="hidden sm:inline">
-          {{ announcementConfig.title }}
-        </span>
-        <ArrowRightIcon class="ml-1 h-4 w-4" />
-      </a>
+      <Announcement />
       <PageHeaderHeading class="hidden md:block">
         Check out some examples.
       </PageHeaderHeading>
diff --git a/apps/www/src/content/blocks.md b/apps/www/src/content/blocks.md
index 82408799..faf6957b 100644
--- a/apps/www/src/content/blocks.md
+++ b/apps/www/src/content/blocks.md
@@ -1,5 +1,5 @@
 ---
-title: Blocks - shadcn-vue
+title: Building Blocks
 ---
 
 <script setup>