diff --git a/app/page.tsx b/app/page.tsx
index f306f40..c034f6f 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,11 +1,17 @@
-import searchPic from '../public/search.svg';
+import mastodonPic from '../public/mastodon.svg';
+import githubPic from '../public/github.svg';
+import instagramPic from '../public/instagram.svg';
+import steamPic from '../public/steam.svg';
 
+import gamePic from '../public/gamepad.svg';
+import projectPic from '../public/project.svg';
 
 import Image from "next/image";
 import Link from "next/link";
 import AnimatedLink from '../components/animatedLink';
 import BlogArea from "../components/blogpost";
-import HeaderToolbar from "../components/header/toolbar";
+
+import MainHeader from "@/components/header/main";
 
 // Mock data for blog posts
 const blogposts = [
@@ -14,46 +20,35 @@ const blogposts = [
     body: 'Explore the fascinating world of retro futurism and its impact on modern science and culture.',
     publish: '2023-10-01',
     get_absolute_url: '/blog/retro-futurism',
+    tags: ["science", "retro", "science-friction"]
   },
   {
     label: 'The Science Behind Video Games',
     body: 'Discover how video games are pushing the boundaries of technology and human interaction.',
     publish: '2023-09-25',
     get_absolute_url: '/blog/science-video-games',
+    tags: ["science", "math", "games"]
+  },
+  {
+    label: 'How to install Docker & Docker Compose',
+    body: 'Guide to install Docker & Docker Compose on your machine.',
+    publish: '2023-09-25',
+    get_absolute_url: '/blog/docker-installation',
+    tags: ["docker", "docker-compose", "linux"]
+  },
+  {
+    label: 'Rocket Science',
+    body: 'Discover how rocket are work.',
+    publish: '2023-09-25',
+    get_absolute_url: '/blog/rocket-science',
+    tags: ["rocket", "space", "engineering"]
   },
 ];
 
 export default function Home() {
   return (
     <div className="text-xl 2xl:mx-64 xl:mx-32 md:mx-6">
-      <header className="flex flex-col">
-        <div className="flex flex-row mt-12 mb-22">
-          <ul className="w-full flex flex-row justify-between items-baseline list-none">
-            <li className="text-4xl">
-              <AnimatedLink href="https://blog.aderk.tech/en">
-                aderk.tech
-              </AnimatedLink>
-            </li>
-
-            <li className="text-6xl flex items-center justify-center filter brightness-0 invert">
-              <Link href="#">
-                <Image
-                  src={searchPic}
-                  alt="search"
-                  width={32}
-                  height={32}
-                />
-              </Link>
-            </li>
-          </ul>
-        </div>
-        <div className="text-2xl mb-20">
-          <p className="leading-10">
-          Hello. I am is a programmer, hacker, and gamer. Love comics, coding, read books. There I am posting articles about science and another staff, that’s im like.
-          </p>
-        </div>
-        <HeaderToolbar />
-      </header>
+      <MainHeader />
 
       <main>
         <BlogArea blogposts={blogposts} />
@@ -61,20 +56,66 @@ export default function Home() {
 
       <footer className="border-t border-white pt-4 flex lg:flex-row max-md:flex-col justify-around text-2xl">
         <ul className="list-none m-4">
-          <li className="text-3xl"><h3>Socials</h3></li>
-          <li className="p-3 text-xl"><AnimatedLink href="https://www.instagram.com/aderkitty/">Instagram</AnimatedLink></li>
-          <li className="p-3 text-xl"><AnimatedLink href="https://mastodon.social/@aderkonstantin">Mastodon</AnimatedLink></li>
-          <li className="p-3 text-xl"><AnimatedLink href="https://github.com/AderKonstantin">GitHub</AnimatedLink></li>
-          <li className="p-3 text-xl"><AnimatedLink href="https://steamcommunity.com/yourprofile">Steam</AnimatedLink></li>
+          <li className="text-2xl mb-3"><h3>Socials</h3></li>
+          <li className="inline text-xl pr-2 mr-2">
+            <Link href="https://www.instagram.com/aderkitty/">
+              <Image
+                src={instagramPic}
+                alt="lang"
+                width={32}
+                height={32}
+                className="inline filter brightness-0 invert"
+              />
+            </Link>
+          </li>
+          <li className="inline text-xl pr-2 mr-2">
+            <Link href="https://mastodon.social/@aderkonstantin">
+              <Image
+                src={mastodonPic}
+                alt="lang"
+                width={32}
+                height={32}
+                className="inline filter brightness-0 invert"
+              />
+            </Link>
+          </li>
+          <li className="inline text-xl pr-2 mr-2">
+            <Link href="https://github.com/AderKonstantin">
+              <Image
+                src={githubPic}
+                alt="lang"
+                width={32}
+                height={32}
+                className="inline filter brightness-0 invert"
+              />
+            </Link>
+          </li>
+          <li className="inline text-xl pr-2 mr-2">
+            <Link href="https://steamcommunity.com/yourprofile">
+              <Image
+                src={steamPic}
+                alt="lang"
+                width={32}
+                height={32}
+                className="inline filter brightness-0 invert"
+              />
+            </Link>
+          </li>
         </ul>
         <ul className="list-none m-4">
-          <li className="text-3xl"><h3>Games</h3></li>
-          <li className="p-3 text-xl"><AnimatedLink href="#">Joe The Rabbit</AnimatedLink></li>
+          <li className="text-2xl mb-3"><h3 className='inline'>Games</h3><Image src={gamePic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert" /></li>
+          <li className="text-xl">
+            <AnimatedLink href="#">Robot Fire</AnimatedLink>
+          </li>
         </ul>
         <ul className="list-none m-4">
-          <li className="text-3xl"><h3>Other Projects</h3></li>
-          <li className="p-3 text-xl"><AnimatedLink href="#">Ader Berry Bot (Telegram)</AnimatedLink></li>
-          <li className="p-3 text-xl"><AnimatedLink href="#">Store</AnimatedLink></li>
+          <li className="text-2xl mb-3"><h3 className='inline'>Other Projects</h3><Image src={projectPic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert" /></li>
+          <li className="text-xl">
+            <AnimatedLink href="#">cloudberrygames</AnimatedLink>
+          </li>
+          <li className="text-xl">
+            <AnimatedLink href="#">northfamily</AnimatedLink>
+          </li>
         </ul>
       </footer>
     </div>
diff --git a/components/blogpost.tsx b/components/blogpost.tsx
index 1bc9722..281f5dd 100644
--- a/components/blogpost.tsx
+++ b/components/blogpost.tsx
@@ -1,5 +1,8 @@
 'use client';
 
+import tagsPic from '../public/tags.svg';
+import calendarPic from '../public/calendar.svg'
+
 import AnimatedLink from '../components/animatedLink';
 import Image from 'next/image';
 
@@ -8,6 +11,7 @@ interface BlogPost {
     body: string;
     publish: string;
     get_absolute_url: string;
+    tags: string[]; 
 }
 
 interface BlogAreaProps {
@@ -16,10 +20,10 @@ interface BlogAreaProps {
 
 export default function BlogArea({ blogposts }: BlogAreaProps) {
     return (
-        <div className="blog-area py-16 border-t border-white w-full">
+        <div className="blog-area pt-16 pb-8 w-full">
             <div className="blogposts">
                 {blogposts.map((blogpost, index) => (
-                    <div key={index} className="blogpost flex flex-row overflow-hidden mb-8">
+                    <div key={index} className="blogpost flex flex-row overflow-hidden mb-14">
                         <div className="left mr-5">
                             <div className="blogpost-image">
                                 <Image
@@ -39,18 +43,22 @@ export default function BlogArea({ blogposts }: BlogAreaProps) {
                                     </AnimatedLink>
                                 </h2>
                             </div>
-                            <ul className="blogpost-tags flex flex-row space-x-4 mb-4">
-                                <li className="tag bg-gray-800 px-4 py-2 rounded-full text-2xl">Games</li>
-                                <li className="tag bg-gray-800 px-4 py-2 rounded-full text-2xl">Science</li>
+                            <ul className="blogpost-tags inline-flex items-center flex-row space-x-4 mb-4">
+                                <li className="tag inline px-2 py-1 rounded-full"><Image src={tagsPic} alt="lang" width={24} height={24} className='inline-flex justify-baseline filter brightness-0 invert' /></li>
+                                {blogpost.tags.map((tag, index) => (
+                                <li className="tag inline border border-slate-400 px-2 py-1 rounded-full text-base">{tag}</li>
+                                ))}
                             </ul>
                             <div className="blogpost-description text-base mb-4">
                                 {blogpost.body.slice(0, 512)}...
                             </div>
                             <div className="blogpost-other flex flex-row justify-between items-end mt-auto">
-                                <div className="text-base">
-                                    <p>Posted: {blogpost.publish}</p>
-                                </div>
-                                <div className="text-2xl">
+                                <ul className="text-base inline-flex justify-end items-center">
+                                    <li className="inline px-2 py-1"><Image src={calendarPic} alt="lang" width={24} height={24} className="filter brightness-0 invert"/></li>
+                                    <li className="inline"><p className='inline mx-2'>{blogpost.publish}</p></li>
+                                </ul>
+
+                                <div className="text-xl">
                                     <AnimatedLink href={blogpost.get_absolute_url}>
                                         Read the article
                                     </AnimatedLink>
diff --git a/components/header/main.tsx b/components/header/main.tsx
new file mode 100644
index 0000000..978238d
--- /dev/null
+++ b/components/header/main.tsx
@@ -0,0 +1,41 @@
+import searchPic from '@/public/search.svg';
+
+
+import Image from "next/image";
+import Link from "next/link";
+
+import AnimatedLink from '../animatedLink';
+import HeaderToolbar from "../header/toolbar";
+
+export default function MainHeader() {
+    return (
+        <header className="flex flex-col">
+        <div className="flex flex-row mt-12 mb-22">
+          <ul className="w-full flex flex-row justify-between items-baseline list-none">
+            <li className="text-4xl">
+              <AnimatedLink href="https://blog.aderk.tech/en">
+                aderk.tech
+              </AnimatedLink>
+            </li>
+
+            <li className="text-6xl flex items-center justify-center filter brightness-0 invert">
+              <Link href="#">
+                <Image
+                  src={searchPic}
+                  alt="search"
+                  width={32}
+                  height={32}
+                />
+              </Link>
+            </li>
+          </ul>
+        </div>
+        <div className="text-2xl mb-20">
+          <p className="leading-10">
+            Hello. I am is a programmer, hacker, and gamer. Love comics, coding, read books. There I am posting articles about science and another staff, that’s im like.
+          </p>
+        </div>
+        <HeaderToolbar />
+      </header>
+    );
+}
\ No newline at end of file
diff --git a/public/calendar.svg b/public/calendar.svg
new file mode 100644
index 0000000..c002b85
--- /dev/null
+++ b/public/calendar.svg
@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
+  <line x1="16" y1="2" x2="16" y2="6" />
+  <line x1="8" y1="2" x2="8" y2="6" />
+  <line x1="3" y1="10" x2="21" y2="10" />
+</svg>
diff --git a/public/gamepad.svg b/public/gamepad.svg
new file mode 100644
index 0000000..d5f0644
--- /dev/null
+++ b/public/gamepad.svg
@@ -0,0 +1,11 @@
+<svg width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.5 17.5C20 21 23.9486 18.4151 23 15C21.5753 9.87113 20.8001 7.01556 20.3969 5.50793C20.1597 4.62136 19.3562 4 18.4384 4L5.56155 4C4.64382 4 3.844 4.62481 3.62085 5.515C2.7815 8.86349 2.0326 11.8016 1.14415 15C0.195501 18.4151 4.14415 21 6.64415 17.5" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18 8.5L18.0111 8.51" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.49 7L16.5011 7.01" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.49 10L16.5011 10.01" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15 8.5L15.0111 8.51" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7 7V10" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.5 8.5H8.5" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8 16C9.10457 16 10 15.1046 10 14C10 12.8954 9.10457 12 8 12C6.89543 12 6 12.8954 6 14C6 15.1046 6.89543 16 8 16Z" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 16C17.1046 16 18 15.1046 18 14C18 12.8954 17.1046 12 16 12C14.8954 12 14 12.8954 14 14C14 15.1046 14.8954 16 16 16Z" stroke="currentColor"  stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/public/github.svg b/public/github.svg
new file mode 100644
index 0000000..afb1814
--- /dev/null
+++ b/public/github.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 496 512" xmlns="http://www.w3.org/2000/svg"><path d="m165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zm65.8-383.2c-138.7 0-244.8 105.3-244.8 244 0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1 100-33.2 167.8-128.1 167.8-239 0-138.7-112.5-244-251.2-244zm-147.6 344.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
\ No newline at end of file
diff --git a/public/instagram.svg b/public/instagram.svg
new file mode 100644
index 0000000..8fc9c72
--- /dev/null
+++ b/public/instagram.svg
@@ -0,0 +1 @@
+<svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m7.46494 1.066c1.17334-.05378 1.54734-.066 4.53506-.066 2.9883 0 3.3617.01283 4.5344.066 1.1715.05317 1.9715.23956 2.6712.5115.7339.27631 1.3987.70924 1.9482 1.26867.5595.54943.9925 1.21429 1.2687 1.94822.2719.69972.4577 1.49967.5115 2.67055.0538 1.17334.066 1.54734.066 4.53506 0 2.9877-.0128 3.3617-.066 4.5351-.0532 1.1708-.2396 1.9708-.5115 2.6705-.2811.723-.6576 1.3371-1.2687 1.9482-.5494.5595-1.2143.9925-1.9482 1.2687-.6997.2719-1.4997.4577-2.6705.5115-1.1734.0538-1.5474.066-4.5351.066-2.98772 0-3.36172-.0128-4.53506-.066-1.17088-.0532-1.97083-.2396-2.67055-.5115-.72295-.2811-1.33711-.6576-1.94822-1.2687-.55953-.5494-.99249-1.2143-1.26867-1.9482-.27194-.6997-.45772-1.4997-.5115-2.6705-.05378-1.1734-.066-1.5468-.066-4.5351 0-2.98833.01283-3.36172.066-4.53444.05317-1.1715.23956-1.97145.5115-2.67117.27631-.73388.70924-1.39871 1.26867-1.94822.54942-.55953 1.21428-.99249 1.94822-1.26867.69972-.27194 1.49967-.45772 2.67055-.5115zm8.98026 1.98c-1.1599-.05256-1.5082-.06417-4.4452-.06417s-3.28533.01161-4.44522.06417c-1.0725.04889-1.65489.22794-2.04234.37889-.51333.19922-.88.43755-1.265.82255-.38438.385-.62333.75167-.82255 1.265-.15095.38745-.33.96984-.37889 2.04234-.05256 1.15989-.06417 1.50822-.06417 4.44522s.01161 3.2853.06417 4.4452c.04889 1.0725.22794 1.6549.37889 2.0424.17622.4778.4573.91.82255 1.265.3549.3652.78717.6463 1.265.8225.38745.151.96984.33 2.04234.3789 1.15989.0526 1.50761.0642 4.44522.0642 2.9376 0 3.2853-.0116 4.4452-.0642 1.0725-.0489 1.6549-.2279 2.0424-.3789.5133-.1992.88-.4375 1.265-.8225.3652-.3549.6463-.7872.8225-1.265.151-.3875.33-.9699.3789-2.0424.0526-1.1599.0642-1.5082.0642-4.4452s-.0116-3.28533-.0642-4.44522c-.0489-1.0725-.2279-1.65489-.3789-2.04234-.1992-.51333-.4375-.88-.8225-1.265-.385-.38438-.7517-.62333-1.265-.82255-.3875-.15095-.9699-.33-2.0424-.37889zm-5.8497 12.3449c.4453.1845.9225.2794 1.4045.2794.9735 0 1.907-.3867 2.5953-1.075.6884-.6883 1.0751-1.6219 1.0751-2.5953s-.3867-1.907-1.0751-2.59532c-.6883-.68832-1.6218-1.07502-2.5953-1.07502-.482 0-.9592.09494-1.4045.27939-.4454.18445-.84997.4548-1.19079.79563-.34082.34082-.61118.74542-.79563 1.19072s-.27938.9226-.27938 1.4046.09493.9593.27938 1.4046.45481.8499.79563 1.1907.74539.6112 1.19079.7956zm-2.59345-7.38889c1.06033-1.06033 2.49845-1.65602 3.99795-1.65602 1.4996 0 2.9377.59569 3.998 1.65602s1.656 2.49849 1.656 3.99799-.5957 2.9376-1.656 3.998c-1.0603 1.0603-2.4984 1.656-3.998 1.656-1.4995 0-2.93762-.5957-3.99795-1.656-1.06033-1.0604-1.65602-2.4985-1.65602-3.998s.59569-2.93766 1.65602-3.99799zm10.90565-.81363c.2506-.25065.3914-.59059.3914-.94505 0-.35447-.1408-.69441-.3914-.94505-.2507-.25064-.5906-.39145-.9451-.39145-.3544 0-.6944.14081-.945.39145-.2507.25064-.3915.59058-.3915.94505 0 .35446.1408.6944.3915.94505.2506.25064.5906.39145.945.39145.3545 0 .6944-.14081.9451-.39145z" fill="#000" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/public/mastodon.svg b/public/mastodon.svg
new file mode 100644
index 0000000..69ab9c0
--- /dev/null
+++ b/public/mastodon.svg
@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="m20.94 14c-.28 1.41-2.44 2.96-4.97 3.26-1.31.15-2.6.3-3.97.24-2.25-.11-4-.54-4-.54v.62c.32 2.22 2.22 2.35 4.03 2.42 1.82.05 3.44-.46 3.44-.46l.08 1.65s-1.28.68-3.55.81c-1.25.07-2.81-.03-4.62-.5-3.92-1.05-4.6-5.24-4.7-9.5l-.01-3.43c0-4.34 2.83-5.61 2.83-5.61 1.45-.66 3.91-.96 6.47-.96h.06c2.56 0 5.02.3 6.47.96 0 0 2.83 1.27 2.83 5.61 0 0 .04 3.21-.39 5.43m-2.94-5.09c0-1.08-.3-1.91-.85-2.56-.56-.63-1.3-.96-2.23-.96-1.06 0-1.87.41-2.42 1.23l-.5.88-.5-.88c-.56-.82-1.36-1.23-2.43-1.23-.92 0-1.66.33-2.23.96-.55.65-.84 1.48-.84 2.56v5.26h2.1v-5.11c0-1.06.45-1.62 1.36-1.62 1 0 1.5.65 1.5 1.93v2.79h2.07v-2.79c0-1.28.5-1.93 1.51-1.93.9 0 1.35.56 1.35 1.62v5.11h2.11z"/></svg>
\ No newline at end of file
diff --git a/public/project.svg b/public/project.svg
new file mode 100644
index 0000000..465269a
--- /dev/null
+++ b/public/project.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,6.5H16v-1a3,3,0,0,0-3-3H11a3,3,0,0,0-3,3v1H5a3,3,0,0,0-3,3v9a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3v-9A3,3,0,0,0,19,6.5Zm-9-1a1,1,0,0,1,1-1h2a1,1,0,0,1,1,1v1H10Zm10,13a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V13a21.71,21.71,0,0,0,8,1.53A21.75,21.75,0,0,0,20,13Zm0-7.69a19.89,19.89,0,0,1-16,0V9.5a1,1,0,0,1,1-1H19a1,1,0,0,1,1,1Z"/></svg>
\ No newline at end of file
diff --git a/public/steam.svg b/public/steam.svg
new file mode 100644
index 0000000..ba29e7d
--- /dev/null
+++ b/public/steam.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m11.979 0c-6.301 0-11.468 4.86-11.957 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142v-.059c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727l-4.605-1.907c1.426 5.037 6.05 8.73 11.543 8.73 6.627 0 11.999-5.373 11.999-12s-5.373-12-11.999-12zm-4.439 18.21-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z"/></svg>
\ No newline at end of file
diff --git a/public/tags.svg b/public/tags.svg
new file mode 100644
index 0000000..49c8817
--- /dev/null
+++ b/public/tags.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <path fill="var(--ci-primary-color, currentColor)" d="M511.974,271.891a47.744,47.744,0,0,0-14.706-33.008L311.57,57.98a29.9,29.9,0,0,0-21.2-8.731H257.228l217.754,212.6.092.088a15.907,15.907,0,0,1,.741,22.337l-156.4,173.355,21.953,21.356L499.447,305.85A47.748,47.748,0,0,0,511.974,271.891Z" class="ci-primary"/>
+  <path fill="var(--ci-primary-color, currentColor)" d="M426.9,283.161a23.924,23.924,0,0,0-5.231-24.742c-.106-.111-.2-.231-.306-.34L224.307,57.716l-.094-.094a31.791,31.791,0,0,0-22.628-9.373H60.194A44.244,44.244,0,0,0,16,92.443v141.1a32.121,32.121,0,0,0,10.045,23.28l210.32,200.2.077.073a23.817,23.817,0,0,0,16.409,6.508q.447,0,.9-.017a24.111,24.111,0,0,0,6.741-1.217,23.854,23.854,0,0,0,10.047-6.517L421.983,291.232A24.033,24.033,0,0,0,426.9,283.161ZM252.5,428.2,48.077,233.612,48,233.54V92.443A12.208,12.208,0,0,1,60.194,80.249h141.39l191.7,194.918Z" class="ci-primary"/>
+  <path fill="var(--ci-primary-color, currentColor)" d="M140,112a52,52,0,1,0,52,52A52.059,52.059,0,0,0,140,112Zm0,72a20,20,0,1,1,20-20A20.023,20.023,0,0,1,140,184Z" class="ci-primary"/>
+</svg>