zen-browser · cybrneon · Dec 30, 2024 · Jan 1, 2025 · Jan 1, 2025 · Jan 5, 2025
diff --git a/src/assets/browsers.png b/src/assets/browsers.png
diff --git a/src/components/Circles.astro b/src/components/Circles.astro
@@ -1,7 +1,7 @@
 ---
 const { white, multiplier = 0.9, class: classList } = Astro.props;
-const sizes = [216, 396, 576, 756]
-const borderWidths = [20, 30, 40, 50]
+const sizes = [216, 396, 576]
+const borderWidths = [20, 30, 40]
 ---
 <div id="circles" class:list={["inset-0 overflow-hidden pointer-events-none", classList]}>
   <div class="mx-auto opacity-10 lg:opacity-100">

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
@@ -20,19 +20,19 @@ const Reddit = icon({ prefix: "fab", iconName: "reddit" });
 
 <footer
   id="footer"
-  class="flex flex-col w-full py-12 px-4 lg:p-24 !pb-0 gap-24 md:gap-[15%] bg-dark text-paper border-t border-dark relative overflow-hidden"
+  class="flex flex-col w-full py-12 px-4 lg:p-24 !pb-0 gap-24 md:gap-[15%] bg-dark text-paper border-t border-dark relative overflow-hidden rounded-tl-[12px] rounded-tr-[12px]"
 >
   <div class="w-full flex justify-between items-center flex-col lg:flex-row">
     <div>
       <Title class="!text-paper">Zen Browser</Title>
-      <Description class="px-4 lg:px-0 lg:w-2/5">
+      <Description class="px-0 lg:px-0 lg:w-2/5">
         Beautifully designed, privacy-focused, and packed with features. We care
         about your experience, not your data.
       </Description>
     </div>
   </div>
   <div class="flex flex-col justify-between w-full lg:flex-row gap-6 lg:pr-52 lg:my-12">
-    <Button href="/download" isPrimary class="h-fit bg-paper w-fit !text-dark">
+    <Button href="/download" isPrimary class="h-fit !bg-coral w-fit">
       Download
       <ArrowRight class="size-4" />
     </Button>
@@ -66,6 +66,7 @@ const Reddit = icon({ prefix: "fab", iconName: "reddit" });
         <div class="opacity-80 flex flex-col">
           <a href="/about" class="font-normal">About Us</a>
           <a href="/privacy-policy" class="font-normal">Privacy Policy</a>
+          <a href="https://live.standards.site/zen" target="_blank" class="font-normal">Brand Assets</a>
         </div>
       </div>
     </div>
@@ -92,9 +93,9 @@ const Reddit = icon({ prefix: "fab", iconName: "reddit" });
     </div>
   </div>
   <div class="flex w-full h-32 items-center">
-    <div class="flex">
+    <div class="flex opacity-65">
       Made with ❤️ by the <a href="/about" class="font-bold inline-block ml-2">Zen Browser Team</a>
     </div>
-    <Circles white multiplier={0.7} class="ml-auto mb-[-100px] mr-[-80px] hidden lg:block" />
+    <Circles white multiplier={0.9} class="ml-auto mb-[-100px] mr-[-80px] hidden lg:block" />
   </div>  
 </footer>
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
@@ -31,7 +31,7 @@ function getHeroTitleAnimation() {
       </div>
       <ArrowRight class="size-4" />
     </motion.a>
-    <Title class='relative text-left px-12 lg:px-0 md:text-center leading-[108px] md:!text-7xl lg:!text-9xl !font-normal'>
+    <Title class='relative text-left px-12 lg:px-0 md:text-center leading-[0.9]! md:!text-7xl lg:!text-9xl !font-normal'>
       <motion.span client:load {...getHeroTitleAnimation()}>
         Welcome
       </motion.span>
@@ -57,7 +57,7 @@ function getHeroTitleAnimation() {
     </motion.span>
     <div class="w-2/3 md:w-fit mt-6 gap-3 sm:gap-6 flex flex-col md:flex-row">
       <motion.span client:load {...getHeroTitleAnimation()}>
-        <Button class="w-full" href="/download" isPrimary>
+        <Button class="w-full h-full" href="/download" isPrimary>
           Download
           <ArrowRight class="size-4" />
         </Button>

diff --git a/src/components/Logo.astro b/src/components/Logo.astro
@@ -1,5 +1,16 @@
-<svg width="32" height="32" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M32 44.3077C38.7974 44.3077 44.3077 38.7974 44.3077 32C44.3077 25.2027 38.7974 19.6923 32 19.6923C25.2027 19.6923 19.6923 25.2027 19.6923 32C19.6923 38.7974 25.2027 44.3077 32 44.3077ZM41.8462 32C41.8462 37.4379 37.4379 41.8462 32 41.8462C26.5621 41.8462 22.1538 37.4379 22.1538 32C22.1538 26.5621 26.5621 22.1538 32 22.1538C37.4379 22.1538 41.8462 26.5621 41.8462 32Z" fill="currentColor"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M53.3333 32C53.3333 43.7821 43.7821 53.3333 32 53.3333C20.2179 53.3333 10.6667 43.7821 10.6667 32C10.6667 20.2179 20.2179 10.6667 32 10.6667C43.7821 10.6667 53.3333 20.2179 53.3333 32ZM32 49.2308C41.5163 49.2308 49.2308 41.5163 49.2308 32C49.2308 22.4837 41.5163 14.7692 32 14.7692C22.4837 14.7692 14.7692 22.4837 14.7692 32C14.7692 41.5163 22.4837 49.2308 32 49.2308Z" fill="currentColor"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M64 32C64 49.6731 49.6731 64 32 64C14.3269 64 0 49.6731 0 32C0 14.3269 14.3269 0 32 0C49.6731 0 64 14.3269 64 32ZM32 58.2564C46.501 58.2564 58.2564 46.501 58.2564 32C58.2564 17.499 46.501 5.74359 32 5.74359C17.499 5.74359 5.74359 17.499 5.74359 32C5.74359 46.501 17.499 58.2564 32 58.2564Z" fill="currentColor"/>
-</svg>
+<svg width="154" height="36" viewBox="0 0 154 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M18 24.9231C21.8235 24.9231 24.9231 21.8235 24.9231 18C24.9231 14.1765 21.8235 11.0769 18 11.0769C14.1765 11.0769 11.0769 14.1765 11.0769 18C11.0769 21.8235 14.1765 24.9231 18 24.9231ZM23.5385 18C23.5385 21.0588 21.0588 23.5385 18 23.5385C14.9412 23.5385 12.4615 21.0588 12.4615 18C12.4615 14.9412 14.9412 12.4615 18 12.4615C21.0588 12.4615 23.5385 14.9412 23.5385 18Z" fill="CurrentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M30 18C30 24.6274 24.6274 30 18 30C11.3726 30 6 24.6274 6 18C6 11.3726 11.3726 6 18 6C24.6274 6 30 11.3726 30 18ZM18 27.6923C23.3529 27.6923 27.6923 23.3529 27.6923 18C27.6923 12.6471 23.3529 8.30769 18 8.30769C12.6471 8.30769 8.30769 12.6471 8.30769 18C8.30769 23.3529 12.6471 27.6923 18 27.6923Z" fill="CurrentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M36 18C36 27.9411 27.9411 36 18 36C8.05887 36 0 27.9411 0 18C0 8.05887 8.05887 0 18 0C27.9411 0 36 8.05887 36 18ZM18 32.7692C26.1568 32.7692 32.7692 26.1568 32.7692 18C32.7692 9.84318 26.1568 3.23077 18 3.23077C9.84318 3.23077 3.23077 9.84318 3.23077 18C3.23077 26.1568 9.84318 32.7692 18 32.7692Z" fill="CurrentColor"/>
+  <path d="M146.553 24.7458V19.5838V14.5391H148.689L148.591 18.352H148.905C148.996 17.4134 149.166 16.6443 149.414 16.0447C149.662 15.4451 149.996 15.0019 150.414 14.7151C150.832 14.4283 151.341 14.2849 151.942 14.2849C152.099 14.2849 152.262 14.3045 152.432 14.3436C152.615 14.3696 152.804 14.4153 153 14.4804L152.882 17.1397C152.673 17.0354 152.451 16.9637 152.216 16.9246C151.994 16.8724 151.785 16.8464 151.589 16.8464C151.093 16.8464 150.668 16.9898 150.316 17.2765C149.963 17.5503 149.675 17.9479 149.453 18.4693C149.244 18.9907 149.107 19.6164 149.042 20.3464V24.7458H146.553Z" fill="CurrentColor"/>
+  <path d="M140.86 25C140.011 25 139.266 24.8826 138.626 24.648C137.986 24.4003 137.45 24.0484 137.019 23.5921C136.588 23.1359 136.261 22.5884 136.039 21.9497C135.817 21.3109 135.706 20.6005 135.706 19.8184C135.706 19.0363 135.811 18.3063 136.02 17.6284C136.242 16.9506 136.562 16.364 136.98 15.8687C137.398 15.3603 137.914 14.9692 138.528 14.6955C139.155 14.4087 139.867 14.2653 140.664 14.2653C141.434 14.2653 142.114 14.3957 142.702 14.6564C143.289 14.9041 143.779 15.2756 144.171 15.7709C144.563 16.2663 144.844 16.8724 145.014 17.5893C145.197 18.2933 145.255 19.0949 145.19 19.9944L137.293 20.0921V18.6452L143.583 18.567L142.897 19.3882C142.963 18.6843 142.904 18.1042 142.721 17.648C142.551 17.1787 142.29 16.8268 141.937 16.5921C141.585 16.3575 141.167 16.2402 140.683 16.2402C140.135 16.2402 139.664 16.3836 139.272 16.6703C138.894 16.9441 138.6 17.3417 138.391 17.8631C138.195 18.3845 138.097 19.0102 138.097 19.7402C138.097 20.8873 138.338 21.7411 138.822 22.3016C139.305 22.8622 139.991 23.1424 140.879 23.1424C141.271 23.1424 141.598 23.0903 141.859 22.986C142.133 22.8687 142.355 22.7253 142.525 22.5558C142.708 22.3733 142.845 22.1713 142.937 21.9497C143.041 21.7281 143.106 21.5 143.133 21.2653L145.347 21.6173C145.282 22.0996 145.144 22.5493 144.935 22.9664C144.726 23.3705 144.439 23.729 144.073 24.0419C143.707 24.3417 143.257 24.5763 142.721 24.7458C142.199 24.9152 141.578 25 140.86 25Z" fill="CurrentColor"/>
+  <path d="M130.469 25C129.777 25 129.15 24.9283 128.588 24.7849C128.039 24.6545 127.562 24.459 127.158 24.1983C126.753 23.9245 126.439 23.5856 126.217 23.1815C125.995 22.7644 125.871 22.2886 125.845 21.7541L127.883 21.2262C127.896 21.6173 128.013 21.9627 128.235 22.2625C128.457 22.5493 128.764 22.7709 129.156 22.9273C129.561 23.0838 130.044 23.162 130.606 23.162C131.233 23.162 131.723 23.0642 132.076 22.8687C132.442 22.6601 132.624 22.3668 132.624 21.9888C132.624 21.702 132.527 21.4804 132.331 21.324C132.148 21.1676 131.873 21.0372 131.508 20.9329C131.142 20.8156 130.698 20.7048 130.175 20.6005C129.653 20.4832 129.143 20.3528 128.647 20.2095C128.15 20.0661 127.7 19.8836 127.295 19.662C126.903 19.4404 126.589 19.1471 126.354 18.7821C126.119 18.4171 126.001 17.9609 126.001 17.4134C126.001 16.7746 126.171 16.2206 126.511 15.7514C126.851 15.2821 127.334 14.9171 127.961 14.6564C128.601 14.3957 129.365 14.2653 130.254 14.2653C131.076 14.2653 131.801 14.3892 132.429 14.6368C133.069 14.8715 133.578 15.2299 133.957 15.7122C134.349 16.1815 134.564 16.7616 134.604 17.4525L132.527 17.9609C132.513 17.5568 132.409 17.2244 132.213 16.9636C132.017 16.6899 131.743 16.4813 131.39 16.3379C131.05 16.1946 130.652 16.1229 130.195 16.1229C129.607 16.1229 129.143 16.2337 128.803 16.4553C128.477 16.6638 128.314 16.9441 128.314 17.296C128.314 17.5828 128.418 17.8109 128.627 17.9804C128.836 18.1499 129.13 18.2867 129.509 18.391C129.888 18.4953 130.332 18.5996 130.841 18.7039C131.338 18.8082 131.828 18.9255 132.311 19.0558C132.794 19.1862 133.232 19.3622 133.624 19.5838C134.029 19.8054 134.349 20.0987 134.584 20.4636C134.819 20.8286 134.937 21.2979 134.937 21.8715C134.937 22.5232 134.76 23.0903 134.408 23.5726C134.055 24.0419 133.545 24.4003 132.879 24.648C132.213 24.8826 131.41 25 130.469 25Z" fill="CurrentColor"/>
+  <path d="M112.67 24.7458L110.044 14.5391H112.65L114.277 22.7122H114.551L116.373 14.5391H119.312L121.135 22.7122H121.39L123.055 14.5391H125.563L122.957 24.7458H119.567L117.902 16.7877H117.667L116.021 24.7458H112.67Z" fill="CurrentColor"/>
+  <path d="M104.752 25C103.76 25 102.878 24.7979 102.107 24.3938C101.35 23.9897 100.749 23.3901 100.304 22.5949C99.8734 21.7867 99.6578 20.796 99.6578 19.6229C99.6578 18.4106 99.8799 17.4134 100.324 16.6312C100.768 15.8361 101.369 15.243 102.127 14.8519C102.898 14.4609 103.766 14.2653 104.733 14.2653C105.726 14.2653 106.601 14.4674 107.359 14.8715C108.129 15.2756 108.73 15.8752 109.161 16.6703C109.605 17.4655 109.828 18.4627 109.828 19.662C109.828 20.8743 109.605 21.878 109.161 22.6731C108.717 23.4553 108.11 24.0419 107.339 24.4329C106.568 24.8109 105.706 25 104.752 25ZM104.811 23.1229C105.151 23.1229 105.471 23.0642 105.771 22.9469C106.085 22.8165 106.353 22.621 106.575 22.3603C106.81 22.0996 106.993 21.7541 107.123 21.324C107.254 20.8938 107.319 20.3789 107.319 19.7793C107.319 19.1536 107.248 18.6191 107.104 18.1759C106.96 17.7197 106.764 17.3482 106.516 17.0614C106.281 16.7746 106 16.5661 105.673 16.4357C105.36 16.3054 105.02 16.2402 104.655 16.2402C104.328 16.2402 104.014 16.3054 103.714 16.4357C103.414 16.553 103.146 16.742 102.911 17.0028C102.675 17.2635 102.493 17.6089 102.362 18.0391C102.231 18.4692 102.166 18.9841 102.166 19.5838C102.166 20.2095 102.231 20.7504 102.362 21.2067C102.506 21.6499 102.702 22.0149 102.95 22.3016C103.198 22.5754 103.479 22.7839 103.792 22.9273C104.106 23.0577 104.446 23.1229 104.811 23.1229Z" fill="CurrentColor"/>
+  <path d="M92.966 24.7458V19.5838V14.5391H95.1018L95.0039 18.352H95.3174C95.4088 17.4134 95.5786 16.6443 95.8268 16.0447C96.0751 15.4451 96.4082 15.0019 96.8262 14.7151C97.2442 14.4283 97.7537 14.2849 98.3546 14.2849C98.5113 14.2849 98.6746 14.3045 98.8445 14.3436C99.0273 14.3696 99.2168 14.4153 99.4127 14.4804L99.2951 17.1397C99.0861 17.0354 98.8641 16.9637 98.6289 16.9246C98.4068 16.8724 98.1978 16.8464 98.0019 16.8464C97.5055 16.8464 97.0809 16.9898 96.7282 17.2765C96.3755 17.5503 96.0881 17.9479 95.866 18.4693C95.657 18.9907 95.5199 19.6164 95.4545 20.3464V24.7458H92.966Z" fill="CurrentColor"/>
+  <path d="M87.5478 25C86.9077 25 86.3525 24.8696 85.8822 24.6089C85.4119 24.3482 85.0266 23.9767 84.7261 23.4944C84.4387 22.9991 84.2297 22.3994 84.0991 21.6955H83.8051L83.8639 24.7458H81.7281V20.0335V11H84.2166V14.1285C84.2166 14.4674 84.197 14.8324 84.1578 15.2235C84.1187 15.6015 84.0664 15.9991 84.0011 16.4162C83.9488 16.8203 83.8835 17.2439 83.8051 17.6872H84.1187C84.2754 16.9832 84.4975 16.3771 84.7849 15.8687C85.0723 15.3603 85.4511 14.9693 85.9214 14.6955C86.3917 14.4218 86.9534 14.2849 87.6065 14.2849C88.4295 14.2849 89.1415 14.5 89.7424 14.9302C90.3564 15.3603 90.8266 15.973 91.1532 16.7682C91.4929 17.5633 91.6627 18.5214 91.6627 19.6425C91.6627 20.7765 91.4929 21.7412 91.1532 22.5363C90.8136 23.3315 90.3368 23.9441 89.7228 24.3743C89.1088 24.7914 88.3838 25 87.5478 25ZM86.764 22.9665C87.2473 22.9665 87.6588 22.8296 87.9984 22.5559C88.3511 22.2821 88.6189 21.8976 88.8018 21.4022C88.9978 20.9069 89.0957 20.3333 89.0957 19.6816C89.0957 19.0298 89.0043 18.4562 88.8214 17.9609C88.6385 17.4525 88.3773 17.0549 88.0376 16.7682C87.698 16.4814 87.28 16.338 86.7836 16.338C86.4439 16.338 86.1369 16.4032 85.8626 16.5335C85.5883 16.6639 85.3466 16.8399 85.1376 17.0615C84.9416 17.2831 84.7718 17.5372 84.6281 17.824C84.4844 18.0978 84.3734 18.3845 84.295 18.6844C84.2297 18.9711 84.197 19.2579 84.197 19.5447V19.7989C84.197 20.1639 84.2493 20.5354 84.3538 20.9134C84.4714 21.2784 84.6347 21.6173 84.8437 21.9302C85.0657 22.243 85.3335 22.4972 85.6471 22.6927C85.9736 22.8752 86.3459 22.9665 86.764 22.9665Z" fill="CurrentColor"/>
+  <path d="M66.8489 24.7458V18.8212V14.5391H68.9652L68.8672 18.1368H69.1611C69.3048 17.1983 69.5334 16.4487 69.8469 15.8882C70.1735 15.3147 70.5785 14.9041 71.0618 14.6564C71.5452 14.3957 72.1069 14.2653 72.747 14.2653C73.3348 14.2653 73.8312 14.3696 74.2362 14.5782C74.6412 14.7737 74.9743 15.0474 75.2355 15.3994C75.4968 15.7383 75.6993 16.1229 75.843 16.553C75.9997 16.9832 76.1042 17.4329 76.1565 17.9022C76.2087 18.3715 76.2349 18.8277 76.2349 19.2709V24.7458H73.7659V19.5642C73.7659 19.2905 73.7463 18.9776 73.7071 18.6257C73.681 18.2607 73.6092 17.9087 73.4916 17.5698C73.374 17.2309 73.1911 16.9506 72.9429 16.729C72.6947 16.5074 72.342 16.3966 71.8848 16.3966C71.3362 16.3966 70.8724 16.5726 70.4936 16.9245C70.1278 17.2635 69.8404 17.7523 69.6314 18.391C69.4355 19.0167 69.3375 19.7532 69.3375 20.6005V24.7458H66.8489Z" fill="CurrentColor"/>
+  <path d="M61.1553 25C60.3062 25 59.5616 24.8826 58.9215 24.648C58.2814 24.4003 57.7458 24.0484 57.3147 23.5921C56.8836 23.1359 56.557 22.5884 56.3349 21.9497C56.1129 21.3109 56.0018 20.6005 56.0018 19.8184C56.0018 19.0363 56.1063 18.3063 56.3153 17.6284C56.5374 16.9506 56.8575 16.364 57.2755 15.8687C57.6935 15.3603 58.2095 14.9692 58.8235 14.6955C59.4505 14.4087 60.1625 14.2653 60.9593 14.2653C61.7301 14.2653 62.4093 14.3957 62.9972 14.6564C63.585 14.9041 64.0749 15.2756 64.4668 15.7709C64.8587 16.2663 65.1396 16.8724 65.3094 17.5893C65.4923 18.2933 65.5511 19.0949 65.4857 19.9944L57.589 20.0921V18.6452L63.879 18.567L63.1931 19.3882C63.2585 18.6843 63.1997 18.1042 63.0168 17.648C62.847 17.1787 62.5857 16.8268 62.233 16.5921C61.8803 16.3575 61.4623 16.2402 60.9789 16.2402C60.4303 16.2402 59.96 16.3836 59.5681 16.6703C59.1893 16.9441 58.8953 17.3417 58.6863 17.8631C58.4904 18.3845 58.3924 19.0102 58.3924 19.7402C58.3924 20.8873 58.6341 21.7411 59.1174 22.3016C59.6008 22.8622 60.2866 23.1424 61.1749 23.1424C61.5668 23.1424 61.8933 23.0903 62.1546 22.986C62.4289 22.8687 62.651 22.7253 62.8208 22.5558C63.0037 22.3733 63.1409 22.1713 63.2323 21.9497C63.3368 21.7281 63.4022 21.5 63.4283 21.2653L65.6425 21.6173C65.5772 22.0996 65.44 22.5493 65.231 22.9664C65.022 23.3705 64.7346 23.729 64.3688 24.0419C64.0031 24.3417 63.5524 24.5763 63.0168 24.7458C62.4943 24.9152 61.8738 25 61.1553 25Z" fill="CurrentColor"/>
+  <path d="M47 24.7458V22.634L52.369 16.7681V16.553H47.098V14.5391H55.465V16.6117L50.0568 22.5167V22.7122H55.5238V24.7458H47Z" fill="CurrentColor"/>
+  </svg>
+
diff --git a/src/components/LogoSmall.astro b/src/components/LogoSmall.astro
@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M32 44.3077C38.7974 44.3077 44.3077 38.7974 44.3077 32C44.3077 25.2027 38.7974 19.6923 32 19.6923C25.2027 19.6923 19.6923 25.2027 19.6923 32C19.6923 38.7974 25.2027 44.3077 32 44.3077ZM41.8462 32C41.8462 37.4379 37.4379 41.8462 32 41.8462C26.5621 41.8462 22.1538 37.4379 22.1538 32C22.1538 26.5621 26.5621 22.1538 32 22.1538C37.4379 22.1538 41.8462 26.5621 41.8462 32Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M53.3333 32C53.3333 43.7821 43.7821 53.3333 32 53.3333C20.2179 53.3333 10.6667 43.7821 10.6667 32C10.6667 20.2179 20.2179 10.6667 32 10.6667C43.7821 10.6667 53.3333 20.2179 53.3333 32ZM32 49.2308C41.5163 49.2308 49.2308 41.5163 49.2308 32C49.2308 22.4837 41.5163 14.7692 32 14.7692C22.4837 14.7692 14.7692 22.4837 14.7692 32C14.7692 41.5163 22.4837 49.2308 32 49.2308Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M64 32C64 49.6731 49.6731 64 32 64C14.3269 64 0 49.6731 0 32C0 14.3269 14.3269 0 32 0C49.6731 0 64 14.3269 64 32ZM32 58.2564C46.501 58.2564 58.2564 46.501 58.2564 32C58.2564 17.499 46.501 5.74359 32 5.74359C17.499 5.74359 5.74359 17.499 5.74359 32C5.74359 46.501 17.499 58.2564 32 58.2564Z" fill="currentColor"/>
+</svg>
diff --git a/src/components/NavBar.astro b/src/components/NavBar.astro
@@ -6,19 +6,23 @@ import Button from '../components/Button.astro'
 import { Astronav, MenuItems, MenuIcon, Dropdown, DropdownItems, DropdownSubmenu } from "astro-navbar";
 import { ArrowRight, ChevronDown, Download, DownloadCloud } from 'lucide-astro'
 import Logo from './Logo.astro';
+import LogoSmall from './LogoSmall.astro';
 import { ThemeSwitch } from 'free-astro-components'
 ---
 
 <nav
   id="nav-bar"
-  class="flex justify-between w-full items-center lg:pt-3 lg:px-6 z-20 relative"
->
+  class="flex justify-between w-full items-center lg:pt-3 lg:px-6 z-20 relative">
+
   <Astronav>
     <MenuItems class="w-full lg:w-fit p-2 bg-paper mx-auto flex gap-2 lg:gap-20 relative">
-      <a class="font-bold text-lg items-center flex gap-2 mr-3" href="/">
-        <Logo class="text-dark" /> <span class="hidden lg:block">zen browser</span>
+      <a class="flex items-center mr-3 hidden md:block" href="/">
+        <Logo class="h-full w-full"/>
+      </a>
+      <a class="flex items-center mr-3 block md:hidden" href="/">
+        <LogoSmall class="h-full w-full"/>
       </a>
-      <div class="gap-6 flex items-center text-xs sm:text-sm lg:text-base">
+      <div class="gap-6 flex items-center text-xs sm:text-sm lg:text-base text-dark">
         <Dropdown class="group">
           <button class="flex items-center">
             <span>Getting Started</span>
@@ -107,18 +111,21 @@ import { ThemeSwitch } from 'free-astro-components'
         <div id="theme-switcher" class="ml-auto md:mr-2">
           <ThemeSwitch label="" class="py-2 px-1" />
         </div>
-        <Button href="/download" class="ml-auto" isPrimary>
-          <span class="hidden md:flex items-center gap-2">
+        <Button href="/download" class="ml-auto bg-dark" isPrimary>
+          <span class="hidden md:flex items-center gap-2 text-paper">
             Download
             <ArrowRight class="size-4" />
           </span>
-          <span class="md:hidden">
+          <span class="md:hidden text-paper">
             <Download class="size-4" />
           </span>
         </Button>
       </div>
     </MenuItems>
   </Astronav>
+  <div id="theme-switcher" class="hidden xl:block py-0 w-fit lg:w-fit lg:rounded-full border-dark right-0 border-b-2 lg:border-2 px-1 absolute backdrop-blur-2xl bg-dark dark:shadow-md mx-0 md:mx-4 flex gap-2 lg:gap-20 font-bold text-lg items-center">
+    <ThemeSwitch label="" class="p-1" />
+  </div>
 </nav>
 <style>
   .navbar-dropdown {
@@ -143,6 +150,13 @@ import { ThemeSwitch } from 'free-astro-components'
 </style>
 <style is:global>
   #theme-switcher * {
-    @apply text-dark;
+    @apply text-paper;
+  }
+  #theme-switcher *:hover {
+    @apply text-coral;
+  }
+  .theme-switcher-small {
+    max-width: 18px;
+    max-height: 18px;
   }
 </style>