diff --git a/app.vue b/app.vue
index da472d5..6b5876b 100644
--- a/app.vue
+++ b/app.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { ParsedContent } from '@nuxt/content/types';
+
 provideHeadlessUseId(() => useId());
 const { seo } = useAppConfig();
 
@@ -31,13 +33,18 @@ useSeoMeta({
 });
 
 defineOgImageComponent('OgImageZK');
+
+const { data: files } = useLazyFetch<ParsedContent[]>('/api/search.json', {
+  default: () => [],
+  server: false,
+});
 </script>
 
 <template>
   <div>
     <NuxtLoadingIndicator />
 
-    <HeaderComponent />
+    <HeaderComponent :search="true" />
 
     <UMain>
       <NuxtLayout>
@@ -47,6 +54,13 @@ defineOgImageComponent('OgImageZK');
 
     <FooterComponent />
 
+    <ClientOnly>
+      <LazyUContentSearch
+        :files="files"
+        :navigation="navigation || []"
+      />
+    </ClientOnly>
+
     <UNotifications />
   </div>
 </template>
diff --git a/content/tutorials/cross-chain-governance/_dir.yml b/content/tutorials/cross-chain-governance/_dir.yml
index bd52e63..ff953a2 100644
--- a/content/tutorials/cross-chain-governance/_dir.yml
+++ b/content/tutorials/cross-chain-governance/_dir.yml
@@ -1,4 +1,5 @@
 title: Cross-chain governance
+featured: true
 authors:
   - name: MatterLabs
     url: https://matter-labs.io
diff --git a/content/tutorials/daily-spend-limit-account/_dir.yml b/content/tutorials/daily-spend-limit-account/_dir.yml
index 6781d42..0b222bd 100644
--- a/content/tutorials/daily-spend-limit-account/_dir.yml
+++ b/content/tutorials/daily-spend-limit-account/_dir.yml
@@ -1,4 +1,5 @@
 title: Native spend limit smart account
+featured: true
 authors:
   - name: porco-rosso
     url: https://linktr.ee/porcorossoj
@@ -22,4 +23,3 @@ tools:
   - zksync-cli
   - zksync-ethers
   - Hardhat
-related_tutorials:
diff --git a/content/tutorials/dapp-nft-paymaster/_dir.yml b/content/tutorials/dapp-nft-paymaster/_dir.yml
index 2e2d042..15213f8 100644
--- a/content/tutorials/dapp-nft-paymaster/_dir.yml
+++ b/content/tutorials/dapp-nft-paymaster/_dir.yml
@@ -23,4 +23,3 @@ tools:
   - zksync-ethers
   - Hardhat
   - react
-related_tutorials:
diff --git a/content/tutorials/erc20-paymaster/_dir.yml b/content/tutorials/erc20-paymaster/_dir.yml
index 5bf0218..46e6dd5 100644
--- a/content/tutorials/erc20-paymaster/_dir.yml
+++ b/content/tutorials/erc20-paymaster/_dir.yml
@@ -1,4 +1,5 @@
 title: Build an ERC20 custom paymaster
+featured: true
 authors:
   - name: MatterLabs
     url: https://matter-labs.io
@@ -23,5 +24,3 @@ tools:
   - zksync-cli
   - zksync-ethers
   - Hardhat
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/frontend-paymaster/_dir.yml b/content/tutorials/frontend-paymaster/_dir.yml
index f5d9f65..11f719b 100644
--- a/content/tutorials/frontend-paymaster/_dir.yml
+++ b/content/tutorials/frontend-paymaster/_dir.yml
@@ -21,5 +21,3 @@ tools:
   - zksync-cli
   - zksync-ethers
   - Hardhat
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-dipdup-indexer/_dir.yml b/content/tutorials/guide-dipdup-indexer/_dir.yml
index 439d01e..2af8361 100644
--- a/content/tutorials/guide-dipdup-indexer/_dir.yml
+++ b/content/tutorials/guide-dipdup-indexer/_dir.yml
@@ -1,4 +1,5 @@
 title: Create an indexer with DipDup
+featured: true
 authors:
   - name: DipDup
     url: https://dipdup.io
@@ -18,5 +19,3 @@ updated: 2024-05-09
 tools:
   - DipDup
   - Python
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-subquery/_dir.yml b/content/tutorials/guide-subquery/_dir.yml
index fcb3840..d4661a6 100644
--- a/content/tutorials/guide-subquery/_dir.yml
+++ b/content/tutorials/guide-subquery/_dir.yml
@@ -19,5 +19,3 @@ updated: 2024-05-09
 tools:
   - SubQuery
   - GraphQL
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-the-graph/_dir.yml b/content/tutorials/guide-the-graph/_dir.yml
index bc330e3..c5e94d9 100644
--- a/content/tutorials/guide-the-graph/_dir.yml
+++ b/content/tutorials/guide-the-graph/_dir.yml
@@ -19,5 +19,3 @@ updated: 2024-05-09
 tools:
   - theGraph
   - GraphQL
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-viem/_dir.yml b/content/tutorials/guide-viem/_dir.yml
index 6c4c5ff..ec303fb 100644
--- a/content/tutorials/guide-viem/_dir.yml
+++ b/content/tutorials/guide-viem/_dir.yml
@@ -1,4 +1,5 @@
 title: Using viem with zkSync
+featured: true
 authors:
   - name: MatterLabs
     url: https://matter-labs.io
@@ -18,5 +19,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - viem
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-wagmi/_dir.yml b/content/tutorials/guide-wagmi/_dir.yml
index ba0544b..cb4c3d6 100644
--- a/content/tutorials/guide-wagmi/_dir.yml
+++ b/content/tutorials/guide-wagmi/_dir.yml
@@ -18,5 +18,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - wagmi
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-walletconnect/_dir.yml b/content/tutorials/guide-walletconnect/_dir.yml
index a3980ea..c16701f 100644
--- a/content/tutorials/guide-walletconnect/_dir.yml
+++ b/content/tutorials/guide-walletconnect/_dir.yml
@@ -16,5 +16,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - walletconnect
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/guide-web3js/_dir.yml b/content/tutorials/guide-web3js/_dir.yml
index c2d77d0..a863321 100644
--- a/content/tutorials/guide-web3js/_dir.yml
+++ b/content/tutorials/guide-web3js/_dir.yml
@@ -1,4 +1,5 @@
 title: Using web3.js to interact with zkSync
+featured: true
 authors:
   - name: ChainSafe
     url: https://web3js.org/
@@ -16,5 +17,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - web3.js
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-deploy-contract/_dir.yml b/content/tutorials/how-to-deploy-contract/_dir.yml
index 337b65d..d159aaa 100644
--- a/content/tutorials/how-to-deploy-contract/_dir.yml
+++ b/content/tutorials/how-to-deploy-contract/_dir.yml
@@ -20,5 +20,3 @@ updated: 2024-05-09
 tools:
   - hardhat-zksync-deploy
   - hardhat-zksync-ethers
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-deposit-erc20/_dir.yml b/content/tutorials/how-to-deposit-erc20/_dir.yml
index de87e35..b0d0fcd 100644
--- a/content/tutorials/how-to-deposit-erc20/_dir.yml
+++ b/content/tutorials/how-to-deposit-erc20/_dir.yml
@@ -16,5 +16,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - zksync-ethers
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-deposit-eth/_dir.yml b/content/tutorials/how-to-deposit-eth/_dir.yml
index a4ebdc1..67dbc04 100644
--- a/content/tutorials/how-to-deposit-eth/_dir.yml
+++ b/content/tutorials/how-to-deposit-eth/_dir.yml
@@ -16,5 +16,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - zksync-ethers
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-send-l2-l1-message/_dir.yml b/content/tutorials/how-to-send-l2-l1-message/_dir.yml
index fd36fbe..418fa25 100644
--- a/content/tutorials/how-to-send-l2-l1-message/_dir.yml
+++ b/content/tutorials/how-to-send-l2-l1-message/_dir.yml
@@ -18,5 +18,3 @@ updated: 2024-05-09
 tools:
   - zksync-ethers
   - zksync-contracts
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-test-contracts/_dir.yml b/content/tutorials/how-to-test-contracts/_dir.yml
index 8f70b48..11221d0 100644
--- a/content/tutorials/how-to-test-contracts/_dir.yml
+++ b/content/tutorials/how-to-test-contracts/_dir.yml
@@ -17,5 +17,3 @@ updated: 2024-05-09
 tools:
   - zksync-ethers
   - era-test-node
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-verify-contracts/_dir.yml b/content/tutorials/how-to-verify-contracts/_dir.yml
index 4b063e6..d31773b 100644
--- a/content/tutorials/how-to-verify-contracts/_dir.yml
+++ b/content/tutorials/how-to-verify-contracts/_dir.yml
@@ -18,5 +18,3 @@ updated: 2024-05-09
 tools:
   - hardhat-zksync-deploy
   - hardhat-zksync-verify
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-withdraw-erc20/_dir.yml b/content/tutorials/how-to-withdraw-erc20/_dir.yml
index 0a245ee..1fca4d6 100644
--- a/content/tutorials/how-to-withdraw-erc20/_dir.yml
+++ b/content/tutorials/how-to-withdraw-erc20/_dir.yml
@@ -16,5 +16,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - zksync-ethers
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/how-to-withdraw-eth/_dir.yml b/content/tutorials/how-to-withdraw-eth/_dir.yml
index aa750ce..3e687da 100644
--- a/content/tutorials/how-to-withdraw-eth/_dir.yml
+++ b/content/tutorials/how-to-withdraw-eth/_dir.yml
@@ -16,5 +16,3 @@ what_you_will_learn:
 updated: 2024-05-09
 tools:
   - zksync-ethers
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/content/tutorials/native-aa-multisig/_dir.yml b/content/tutorials/native-aa-multisig/_dir.yml
index 19f31d4..e1125b2 100644
--- a/content/tutorials/native-aa-multisig/_dir.yml
+++ b/content/tutorials/native-aa-multisig/_dir.yml
@@ -22,5 +22,3 @@ tools:
   - zksync-cli
   - zksync-ethers
   - Hardhat
-related_tutorials:
-  - /tutorials/another-tutorial
diff --git a/error.vue b/error.vue
index da611b5..9db3021 100644
--- a/error.vue
+++ b/error.vue
@@ -31,7 +31,7 @@ provide('navigation', navigation);
 
 <template>
   <div>
-    <HeaderComponent :links="[]" />
+    <HeaderComponent :search="true" />
 
     <UMain>
       <UContainer>
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 0978b36..fe1a62d 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -13,7 +13,20 @@ export default defineNuxtConfig({
   },
   content: {
     navigation: {
-      fields: ['authors', 'tags', 'summary', 'updated', 'tools', 'featured', 'description'],
+      fields: [
+        'authors',
+        'tags',
+        'summary',
+        'updated',
+        'tools',
+        'featured',
+        'description',
+        'github_repo',
+        'what_you_will_learn',
+      ],
     },
   },
+  routeRules: {
+    '/api/search.json': { prerender: true },
+  },
 });
diff --git a/pages/index.vue b/pages/index.vue
index c00ab88..db58534 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -8,7 +8,7 @@ const navigation = inject<Ref<NavItem[]>>('navigation');
 const guides = computed(() => {
   const tutorialPath = navigation?.value.find((item) => item._path === '/tutorials') ?? { children: [] };
 
-  return tutorialPath.children;
+  return tutorialPath.children?.filter((tutorial) => tutorial.featured);
 });
 
 useSeoMeta({
@@ -33,6 +33,7 @@ useSeoMeta({
           size: 'xl',
         },
       ]"
+      :ui="{ description: 'backdrop-blur bg-background/65' }"
     >
       <template #headline>
         <NuxtImg
@@ -43,37 +44,29 @@ useSeoMeta({
       </template>
 
       <UPageGrid>
-        <SiteLink
+        <ULandingCard
           v-for="(guide, index) of guides"
           :key="index"
           :to="guide._path"
-          class="hover:border-zkPurple-300 rounded-lg border-2 border-transparent transition-colors duration-200 ease-in-out"
+          :title="guide.title"
+          :description="guide.summary"
+          :ui="{ body: { base: 'justify-between' } }"
         >
-          <UCard>
-            <span class="mb-4 inline-block text-lg font-semibold">
-              {{ guide.title }}
-            </span>
-
-            <p>{{ guide.summary }}</p>
-
-            <AuthorsList
-              class="my-4"
-              :authors="guide.authors"
-            />
-
-            <div class="mt-4">
+          <div class="mt-auto">
+            <AuthorsList :authors="guide.authors" />
+            <div class="mt-2">
               <UBadge
-                v-for="tag in guide.tags"
-                :key="tag"
+                v-for="(tag, index) of guide.tags"
+                :key="index"
                 :label="tag"
                 color="blue"
-                size="sm"
+                size="xs"
                 variant="subtle"
-                class="mb-2 mr-2"
+                class="mr-2"
               />
             </div>
-          </UCard>
-        </SiteLink>
+          </div>
+        </ULandingCard>
       </UPageGrid>
     </ULandingSection>
   </div>
diff --git a/pages/tutorials/[...slug].vue b/pages/tutorials/[...slug].vue
index 540b9e7..e02f884 100644
--- a/pages/tutorials/[...slug].vue
+++ b/pages/tutorials/[...slug].vue
@@ -15,7 +15,6 @@ const metadata = computed(() => {
     .find((item) => item._path === '/tutorials')
     ?.children?.find((item) => item._path === `/tutorials/${route.params.slug[0]}`);
 });
-
 const isIndex = ref(route.params.slug.length < 2);
 
 const { data: page } = await useAsyncData(route.path, () => queryContent(route.path).findOne());
@@ -120,22 +119,25 @@ const communityLinks = [
             <p>
               {{ metadata.description }}
             </p>
-            <h3 class="mt-4 text-xl font-semibold">What you'll learn:</h3>
-            <ul
-              role="list"
-              class="list-inside list-disc"
-            >
-              <li
-                v-for="item in metadata.what_you_will_learn"
-                :key="item"
+            <template v-if="metadata.what_you_will_learn">
+              <h3 class="mt-4 text-xl font-semibold">What you'll learn:</h3>
+              <ul
+                role="list"
+                class="mt-2 list-inside list-disc space-y-1"
               >
-                {{ item }}
-              </li>
-            </ul>
+                <li
+                  v-for="item in metadata.what_you_will_learn"
+                  :key="item"
+                >
+                  {{ item }}
+                </li>
+              </ul>
+            </template>
           </div>
 
           <div class="col-span-3">
             <UButton
+              v-if="metadata.github_repo"
               icon="i-simple-icons-github"
               size="sm"
               color="white"
@@ -145,35 +147,39 @@ const communityLinks = [
               :to="metadata.github_repo"
               :trailing="false"
             />
-            <h3 class="my-2 text-xl font-semibold">Last Updated:</h3>
-            <p>{{ lastUpdated }}</p>
-            <h3 class="my-2 text-xl font-semibold">Tools:</h3>
-            <ul
-              role="list"
-              class="list-inside list-disc"
-            >
-              <li
-                v-for="item in metadata.tools"
-                :key="item"
+            <template v-if="metadata.tools">
+              <h3 class="my-2 text-lg font-semibold">Tools:</h3>
+              <ul
+                role="list"
+                class="list-inside list-none"
               >
-                {{ item }}
-              </li>
-            </ul>
-            <h3 class="my-2 text-xl font-semibold">Tags:</h3>
-            <div class="flex flex-wrap">
-              <UBadge
-                v-for="tag in metadata.tags"
-                :key="tag"
-                :label="tag"
-                color="blue"
-                size="sm"
-                variant="subtle"
-                class="mb-2 mr-2"
-              />
-            </div>
+                <li
+                  v-for="item in metadata.tools"
+                  :key="item"
+                >
+                  - {{ item }}
+                </li>
+              </ul>
+            </template>
+            <template v-if="metadata.tags">
+              <div class="mt-4 flex flex-wrap">
+                <UBadge
+                  v-for="tag in metadata.tags"
+                  :key="tag"
+                  :label="tag"
+                  color="blue"
+                  size="sm"
+                  variant="subtle"
+                  class="mb-2 mr-2"
+                />
+              </div>
+            </template>
+            <template v-if="metadata.updated">
+              <strong class="text-md my-2">Last Updated: </strong>{{ lastUpdated }}
+            </template>
           </div>
         </div>
-        <UDivider icon="i-zksync-logo" />
+        <UDivider icon="i-zksync-zksync-logo" />
       </UPage>
 
       <UPage>