diff --git a/app/config/locale/templates/email-base-styled.tpl b/app/config/locale/templates/email-base-styled.tpl
index b5aece0253..16036e792c 100644
--- a/app/config/locale/templates/email-base-styled.tpl
+++ b/app/config/locale/templates/email-base-styled.tpl
@@ -1,9 +1,24 @@
 <!doctype html>
 <html>
     <head>
-        <link rel="preconnect" href="https://fonts.googleapis.com">
-        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600&display=swap">
+        <link rel="preconnect" href="https://assets.appwrite.io/" crossorigin>
+        <style>
+            @font-face {
+                font-family: 'Inter';
+                src: url('https://assets.appwrite.io/fonts/inter/Inter-Regular.woff2') format('woff2');
+                font-weight: 400;
+                font-style: normal;
+                font-display: swap;
+            }
+
+            @font-face {
+                font-family: 'DM Sans';
+                src: url('https://assets.appwrite.io/fonts/dm-sans/dm-sans-v16-latin-600.woff2') format('woff2');
+                font-weight: 600;
+                font-style: normal;
+                font-display: swap;
+            }
+        </style>
         <style>
             @media (max-width:500px) {
                 .mobile-full-width {
diff --git a/app/config/locale/templates/email-base.tpl b/app/config/locale/templates/email-base.tpl
index f6807ce7b2..8c94c3f63e 100644
--- a/app/config/locale/templates/email-base.tpl
+++ b/app/config/locale/templates/email-base.tpl
@@ -1,9 +1,32 @@
 <!doctype html>
 <html>
     <head>
-        <link rel="preconnect" href="https://fonts.googleapis.com">
-        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600&display=swap">
+        <link rel="preconnect" href="https://assets.appwrite.io/" crossorigin>
+        <style>
+            @font-face {
+                font-family: 'Inter';
+                src: url('https://assets.appwrite.io/fonts/inter/Inter-Regular.woff2') format('woff2');
+                font-weight: 400;
+                font-style: normal;
+                font-display: swap;
+            }
+            
+            @font-face {
+                font-family: 'DM Sans';
+                src: url('https://assets.appwrite.io/fonts/dm-sans/dm-sans-v16-latin-600.woff2') format('woff2');
+                font-weight: 600;
+                font-style: normal;
+                font-display: swap;
+            }
+            
+            @font-face {
+                font-family: 'Poppins';
+                src: url('https://assets.appwrite.io/fonts/poppins/poppins-v23-latin-regular.woff2') format('woff2');
+                font-weight: 400;
+                font-style: normal;
+                font-display: swap;
+            }
+        </style>
         <style>
             body {
                 padding: 32px;
@@ -15,6 +38,7 @@
                 background-color: #ffffff;
                 margin: 0;
                 padding: 0;
+                line-height: 150%;
             }
             a {
                 color: currentColor;
@@ -67,58 +91,16 @@
                 border: none;
                 border-top: 1px solid #e8e9f0;
             }
+            h* {
+                font-family: 'Poppins', sans-serif;
+            }
+    
+            p {
+                margin-bottom: 10px;
+            }
         </style>
     </head>
 
-<head>
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link
-            href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600&display=swap"
-            rel="stylesheet">
-    <style>
-        a { color:currentColor; word-break: break-all; }
-        body {
-            background-color: #ffffff;
-            padding: 32px;
-            color: #616B7C;
-            font-size: 15px;
-            font-family: 'Inter', sans-serif;
-            line-height: 150%;
-        }
-
-        table {
-            width: 100%;
-            border-spacing: 0 !important;
-        }
-
-        table,
-        tr,
-        th,
-        td {
-            margin: 0;
-            padding: 0;
-        }
-
-        td {
-            vertical-align: top;
-        }
-
-        h* {
-            font-family: 'Poppins', sans-serif;
-        }
-
-        hr {
-            border: none;
-            border-top: 1px solid #E8E9F0;
-        }
-
-        p {
-            margin-bottom: 10px;
-        }
-    </style>
-</head>
-
 <body style="direction: {{direction}}">
 
 <div style="display: none; overflow: hidden; max-height: 0; max-width: 0; opacity: 0; line-height: 1px;">
diff --git a/app/views/general/404.phtml b/app/views/general/404.phtml
index 6dbf158205..e89e295701 100644
--- a/app/views/general/404.phtml
+++ b/app/views/general/404.phtml
@@ -6,26 +6,29 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>404 Not Found</title>
 
-    <link rel="preconnect" href="https://fonts.appwrite.io/">
+    <link rel="preconnect" href="https://assets.appwrite.io/" crossorigin>
     <style>
         @font-face {
             font-family: 'Inter';
-            src: url('https://fonts.appwrite.io/inter/Inter-Regular.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/inter/Inter-Regular.woff2') format('woff2');
             font-weight: 400;
             font-style: normal;
+            font-display: swap;
         }
         @font-face {
             font-family: 'Inter';
-            src: url('https://fonts.appwrite.io/inter/Inter-Medium.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/inter/Inter-Medium.woff2') format('woff2');
             font-weight: 500;
             font-style: normal;
+            font-display: swap;
         }
         
         @font-face {
             font-family: 'Fira Code';
-            src: url('https://fonts.appwrite.io/fira-code/FiraCode-Regular.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/fira-code/FiraCode-Regular.woff2') format('woff2');
             font-weight: 400;
             font-style: normal;
+            font-display: swap;
         }
     </style>
     <style>
diff --git a/app/views/general/error.phtml b/app/views/general/error.phtml
index 23a4867fda..9e74be67e2 100644
--- a/app/views/general/error.phtml
+++ b/app/views/general/error.phtml
@@ -107,18 +107,18 @@ switch ($type) {
     <link rel="icon" type="image/svg+xml" href="<?php echo $url; ?>/images/logos/appwrite-icon.svg" />
     <link rel="mask-icon" type="image/png" href="<?php echo $url; ?>/images/logos/appwrite-icon.png" />
 
-    <link rel="preconnect" href="https://fonts.appwrite.io/" crossorigin>
+    <link rel="preconnect" href="https://assets.appwrite.io/" crossorigin>
     <style>
         @font-face {
             font-family: 'Inter';
-            src: url('https://fonts.appwrite.io/inter/Inter-Regular.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/inter/Inter-Regular.woff2') format('woff2');
             font-weight: 400;
             font-style: normal;
             font-display: swap;
         }
         @font-face {
             font-family: 'Inter';
-            src: url('https://fonts.appwrite.io/inter/Inter-Medium.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/inter/Inter-Medium.woff2') format('woff2');
             font-weight: 500;
             font-style: normal;
             font-display: swap;
@@ -126,7 +126,7 @@ switch ($type) {
         
         @font-face {
             font-family: 'Fira Code';
-            src: url('https://fonts.appwrite.io/fira-code/FiraCode-Regular.woff2') format('woff2');
+            src: url('https://assets.appwrite.io/fonts/fira-code/FiraCode-Regular.woff2') format('woff2');
             font-weight: 400;
             font-style: normal;
             font-display: swap;
diff --git a/src/Appwrite/Transformation/Adapter/Preview.php b/src/Appwrite/Transformation/Adapter/Preview.php
index 70af19a188..bfbb2e82fd 100644
--- a/src/Appwrite/Transformation/Adapter/Preview.php
+++ b/src/Appwrite/Transformation/Adapter/Preview.php
@@ -32,9 +32,24 @@ class Preview extends Adapter
         $this->output = $this->input;
 
         $banner = <<<EOT
+        <link rel="preconnect" href="https://assets.appwrite.io/" crossorigin>
+        <style>
+            @font-face {
+                font-family: 'Inter';
+                src: url('https://assets.appwrite.io/fonts/inter/Inter-Regular.woff2') format('woff2');
+                font-weight: 400;
+                font-style: normal;
+                font-display: swap;
+            }
+            @font-face {
+                font-family: 'Inter';
+                src: url('https://assets.appwrite.io/fonts/inter/Inter-Medium.woff2') format('woff2');
+                font-weight: 500;
+                font-style: normal;
+                font-display: swap;
+            }
+        </style>
         <style>
-            @import url(https://fonts.bunny.net/css?family=fira-code:400|inter:400);
-            
             #appwrite-preview {
                 min-width: auto;
                 min-height: auto;
