diff --git a/src/components/branding-assets.tsx b/src/components/branding-assets.tsx
index 5100b07..e04905e 100644
--- a/src/components/branding-assets.tsx
+++ b/src/components/branding-assets.tsx
@@ -16,7 +16,7 @@ export function BrandingAssets() {
         <div className="grid grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 mt-10 w-full">
           {LOGO_COLORS.map((color) => (
             <div key={color} className="flex flex-col items-center">
-              <img src={`/logos/zen-${color}.svg`} alt={`Zen Browser ${color} logo`} className="w-24 h-24 mt-4" />
+              <img src={`https://cdn.jsdelivr.net/gh/zen-browser/www/public/logos/zen-${color}.svg`} alt={`Zen Browser ${color} logo`} className="w-24 h-24 mt-4" />
               <div className="flex items-center my-2">
                 <a
                   href={`/logos/zen-${color}.svg`}
@@ -38,7 +38,7 @@ export function BrandingAssets() {
         <div className="grid grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 mt-10 w-full">
           {LOGO_COLORS.map((color) => (
             <div key={color} className="flex flex-col items-center">
-              <img src={`/logos/zen-alpha-${color}.svg`} alt={`Zen Browser ${color} logo`} className="w-24 h-24 mt-4" />
+              <img src={`https://cdn.jsdelivr.net/gh/zen-browser/www/public/logos/zen-alpha-${color}.svg`} alt={`Zen Browser ${color} logo`} className="w-24 h-24 mt-4" />
               <div className="flex items-center my-2">
                 <a
                   href={`/logos/zen-alpha-${color}.svg`}
diff --git a/src/components/features.tsx b/src/components/features.tsx
index c29390c..8683e0f 100644
--- a/src/components/features.tsx
+++ b/src/components/features.tsx
@@ -197,7 +197,7 @@ export default function Features() {
               </Link>
             </div>
             <img
-              src="/compact-mode.png"
+              src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/compact-mode.png"
               className="scale-105 hover:scale-110 transform rotate-[-2deg] transition-all duration-100 rounded-md w-full shadow-md dark:shadow-none dark:border-2 mt-16 border-blue-600"
             />
           </div>
@@ -207,7 +207,7 @@ export default function Features() {
             <div className="font-bold text-md">
               What makes Zen Browser different?
             </div>
-            <img src="/favicon.ico" className="ml-auto w-7 h-7" />
+            <img src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/favicon.ico" className="ml-auto w-7 h-7" />
           </div>
           <div className="h-full w-full flex items-center justify-center">
             <Table className="w-full">
@@ -233,7 +233,7 @@ export default function Features() {
                     <Image
                       height={32}
                       width={32}
-                      src="/floorp.png"
+                      src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/floorp.png"
                       className="bg-black dark:bg-white rounded-md p-1 mx-auto mb-2 w-7 h-7"
                       alt="floorp"
                     />
@@ -243,7 +243,7 @@ export default function Features() {
                     <Image
                       height={32}
                       width={32}
-                      src="/librewolf.png"
+                      src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/librewolf.png"
                       className="bg-black dark:bg-white rounded-md mx-auto p-1 mb-2 w-7 h-7"
                       alt="librewolf"
                     />
@@ -382,21 +382,21 @@ export default function Features() {
           <div className="relative p-16 border-r-2 flex flex-col items-center justify-center row-span-2 col-span-2">
             <div className="relative w-full h-full flex items-center justify-center">
               <img
-                src="/split-view.png"
+                src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/split-view.png"
                 className={ny(
                   'absolute hover:scale-105 rounded-md w-full shadow-md dark:shadow-none dark:border-2 border-blue-500 transform transition-all duration-300',
                   feature === 0 ? 'translate-x-0' : '-translate-x-1/4 opacity-0'
                 )}
               />
               <img
-                src="/workspaces.png"
+                src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/workspaces.png"
                 className={ny(
                   'absolute hover:scale-105 rounded-md w-full shadow-md dark:shadow-none dark:border-2 border-blue-500 transform transition-all duration-300',
                   feature === 1 ? 'translate-x-0' : '-translate-x-1/4 opacity-0'
                 )}
               />
               <img
-                src="/sidebar.png"
+                src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/sidebar.png"
                 className={ny(
                   'absolute hover:scale-105 rounded-md w-full shadow-md dark:shadow-none dark:border-2 border-blue-500 transform transition-all duration-300',
                   feature === 2 ? 'translate-x-0' : '-translate-x-1/4 opacity-0'
diff --git a/src/components/header.tsx b/src/components/header.tsx
index 7c0426c..b118d9e 100644
--- a/src/components/header.tsx
+++ b/src/components/header.tsx
@@ -70,14 +70,14 @@ export default function Header() {
             <Image
               width={1500}
               height={700}
-              src="/browser-dark.png"
+              src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/browser-dark.png"
               alt="browser Image"
               className="relative hidden rounded-[inherit] border object-contain dark:block"
             />
             <Image
               width={1500}
               height={700}
-              src="/browser-light.png"
+              src="https://cdn.jsdelivr.net/gh/zen-browser/www/public/browser-light.png"
               alt="browser Image"
               className="relative block rounded-[inherit]  border object-contain dark:hidden"
             />
diff --git a/src/components/logo.tsx b/src/components/logo.tsx
index 685fa44..c986f9e 100644
--- a/src/components/logo.tsx
+++ b/src/components/logo.tsx
@@ -14,7 +14,7 @@ export default function Logo({ withText, ...props }: any) {
   }, []);
   return (
     <div className="flex items-center m-0" {...props}>
-      <Image src={`/logos/zen-${randomColor}.svg`} width={40} height={40} alt="Zen Logo" className={ny("transition-all duration-300 hover:scale-110", withText && "mr-2")} />
+      <Image src={`https://cdn.jsdelivr.net/gh/zen-browser/www/public/logos/zen-${randomColor}.svg`} width={40} height={40} alt="Zen Logo" className={ny("transition-all duration-300 hover:scale-110", withText && "mr-2")} />
       {withText && <span className="text-2xl font-bold ml-2">zen</span>}
     </div>
   );