diff --git a/docs/content/3.showcase.md b/docs/content/3.showcase.md
index df0c07f9d8..9e139cbef2 100644
--- a/docs/content/3.showcase.md
+++ b/docs/content/3.showcase.md
@@ -12,13 +12,32 @@ image:
   format: 'webp'
   height: '216'
   width: '400'
+buttonsTextLeft: 'Download extension:'
+buttonsHidden: true
+buttons:
+  - label: 'Chrome'
+    size: 'lg'
+    variant: 'secondary'
+    to: 'https://chrome.google.com/webstore/detail/vue-telescope/neaebjphlfplgdhedjdhcnpjkndddbpd'
+    icon: 'logos:chrome'
+    target: '_blank'
+  - label: 'Firefox'
+    size: 'lg'
+    variant: 'secondary'
+    to: 'https://addons.mozilla.org/en/firefox/addon/vue-telescope/'
+    icon: 'logos:firefox'
+    target: '_blank'
+  - label: 'Edge'
+    size: 'lg'
+    variant: 'secondary'
+    to: 'https://microsoftedge.microsoft.com/addons/detail/vue-telescope/icgcillpgelpleniodgkmohgdmeogodl'
+    icon: 'logos:microsoft-edge'
+    target: '_blank'
 ---
 #title
 Showcase
 #description
 Discover our selection of websites built with Nuxt. This collection is powered by VueTelescope.
-#extra
-:::showcases-buttons-hero
 ::
 
 :ShowcasesList
diff --git a/docs/content/4.support/2.agencies/1.index.md b/docs/content/4.support/2.agencies/1.index.md
index 2abc14fc32..450d8dc64f 100644
--- a/docs/content/4.support/2.agencies/1.index.md
+++ b/docs/content/4.support/2.agencies/1.index.md
@@ -10,8 +10,11 @@ image:
   format: 'svg'
   height: '216'
   width: '400'
-buttonText: 'Submit my agency'
-to: 'https://docs.google.com/forms/d/e/1FAIpQLSf85qskit5QqmGJcruGkGF0U7240Bh9MeN0pHB18UiOMWC8dA/viewform'
+buttons:
+  - label: 'Submit my agency'
+    variant: 'primary-gradient'
+    to: 'https://docs.google.com/forms/d/e/1FAIpQLSf85qskit5QqmGJcruGkGF0U7240Bh9MeN0pHB18UiOMWC8dA/viewform'
+    target: '_blank'
 ---
 #title
 Agencies
diff --git a/docs/content/4.support/3.us.md b/docs/content/4.support/3.us.md
index abe0b45564..bc3dadd684 100644
--- a/docs/content/4.support/3.us.md
+++ b/docs/content/4.support/3.us.md
@@ -11,8 +11,11 @@ image:
   format: 'webp'
   height: '216'
   width: '400'
-buttonText: 'Become a sponsor'
-to: 'https://github.com/sponsors/nuxt'
+buttons:
+  - label: 'Become a sponsor'
+    variant: 'primary-gradient'
+    to: 'https://github.com/sponsors/nuxt'
+    target: '_blank'
 ---
 #title
 Sponsors
diff --git a/docs/content/4.support/4.jobs.md b/docs/content/4.support/4.jobs.md
index 9a01e631a0..f3ab284d17 100644
--- a/docs/content/4.support/4.jobs.md
+++ b/docs/content/4.support/4.jobs.md
@@ -11,8 +11,11 @@ image:
   format: 'webp'
   height: '216'
   width: '400'
-buttonText: 'Post a job'
-to: 'https://vuejobs.com/jobs/create'
+buttons:
+  - label: 'Post a job'
+    variant: 'primary-gradient'
+    to: 'https://vuejobs.com/jobs/create'
+    target: '_blank'
 ---
 #title
 Explore Nuxt Jobs
diff --git a/docs/content/design-kit.md b/docs/content/design-kit.md
index 7fa3d5510a..4871b7ac40 100644
--- a/docs/content/design-kit.md
+++ b/docs/content/design-kit.md
@@ -11,14 +11,24 @@ image:
   format: 'webp'
   height: '216'
   width: '400'
+buttons:
+  - label: 'Download Design Kit'
+    size: 'lg'
+    variant: 'secondary'
+    to: '/assets/design-kit/nuxt-assets.zip'
+    target: '_blank'
+  - label: 'Preview guidelines'
+    size: 'lg'
+    to: 'https://www.figma.com/file/DOO3neicujKl3ymcqUg9dK/%E2%9B%B0%EF%B8%8F---Nuxt-Brand-Guidelines?node-id=0%3A1&t=qBS3UqvGpjrIkxIm-1'
+    icon: 'uil:arrow-right'
+    trailing: 'trailing'
+    download: true
+    target: '_blank'
 ---
 #title
 Design Kit
 #description
 Welcome to Nuxt design definition page. Identity was redefined by handpicking conscientiously colors, typography and shapes in order to put forward how performant, useful & easy Nuxt products are.
-#extra
-:::resources-design-kit-assets-link
-:::
 ::
 
 ::resources-design-kit-section
diff --git a/docs/public/assets/design-kit/nuxt-assets.zip b/docs/public/assets/design-kit/nuxt-assets.zip
index 4db8dbda3a..aa0024d161 100644
Binary files a/docs/public/assets/design-kit/nuxt-assets.zip and b/docs/public/assets/design-kit/nuxt-assets.zip differ