diff --git a/tools/tenscan/frontend/next.config.js b/tools/tenscan/frontend/next.config.js
index a843cbee09..50f8420725 100644
--- a/tools/tenscan/frontend/next.config.js
+++ b/tools/tenscan/frontend/next.config.js
@@ -1,6 +1,9 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-}
+  images: {
+    unoptimized: true,
+  },
+};
 
-module.exports = nextConfig
+module.exports = nextConfig;
diff --git a/tools/tenscan/frontend/public/assets/images/black_logotype.png b/tools/tenscan/frontend/public/assets/images/black_logotype.png
new file mode 100644
index 0000000000..f086b796a2
Binary files /dev/null and b/tools/tenscan/frontend/public/assets/images/black_logotype.png differ
diff --git a/tools/tenscan/frontend/public/assets/images/white_logotype.png b/tools/tenscan/frontend/public/assets/images/white_logotype.png
new file mode 100644
index 0000000000..f3c47d13f9
Binary files /dev/null and b/tools/tenscan/frontend/public/assets/images/white_logotype.png differ
diff --git a/tools/tenscan/frontend/public/favicon.ico b/tools/tenscan/frontend/public/favicon.ico
index 1bb8f324a1..0e8dea2f71 100644
Binary files a/tools/tenscan/frontend/public/favicon.ico and b/tools/tenscan/frontend/public/favicon.ico differ
diff --git a/tools/tenscan/frontend/src/components/layouts/header.tsx b/tools/tenscan/frontend/src/components/layouts/header.tsx
index d2ddfb493d..a04de0fea8 100644
--- a/tools/tenscan/frontend/src/components/layouts/header.tsx
+++ b/tools/tenscan/frontend/src/components/layouts/header.tsx
@@ -6,13 +6,27 @@ import { HamburgerMenuIcon } from "@radix-ui/react-icons";
 import { useState } from "react";
 import { Button } from "../ui/button";
 import HealthIndicator from "../health-indicator";
+import Image from "next/image";
 
 export default function Header() {
   return (
     <div className="border-b">
       <div className="flex h-16 justify-between items-center px-4">
         <Link href="/">
-          <h1 className="text-40">TEN.</h1>
+          <Image
+            src="/assets/images/black_logotype.png"
+            alt="Logo"
+            width={150}
+            height={40}
+            className="cursor-pointer dark:hidden"
+          />
+          <Image
+            src="/assets/images/white_logotype.png"
+            alt="Logo"
+            width={150}
+            height={40}
+            className="cursor-pointer hidden dark:block"
+          />
         </Link>
         <div className="hidden md:flex items-center space-x-4">
           <MainNav className="mx-6" />
diff --git a/tools/tenscan/frontend/styles/fonts/CloudSoft-Bold_700.otf b/tools/tenscan/frontend/styles/fonts/CloudSoft-Bold_700.otf
deleted file mode 100644
index ed9d1c4014..0000000000
Binary files a/tools/tenscan/frontend/styles/fonts/CloudSoft-Bold_700.otf and /dev/null differ
diff --git a/tools/tenscan/frontend/styles/fonts/CloudSoft-Light_300.otf b/tools/tenscan/frontend/styles/fonts/CloudSoft-Light_300.otf
deleted file mode 100644
index 2e309e36c3..0000000000
Binary files a/tools/tenscan/frontend/styles/fonts/CloudSoft-Light_300.otf and /dev/null differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-BlackItalic.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-BlackItalic.ttf
new file mode 100644
index 0000000000..df12ca10d2
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-BlackItalic.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Bold.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Bold.ttf
new file mode 100644
index 0000000000..809e9788a3
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Bold.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Light.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Light.ttf
new file mode 100644
index 0000000000..1acb39b2d1
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Light.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Medium.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Medium.ttf
new file mode 100644
index 0000000000..c29713e545
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Medium.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Regular.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Regular.ttf
new file mode 100644
index 0000000000..28ff3c878d
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-Regular.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-SemiBold.ttf b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-SemiBold.ttf
new file mode 100644
index 0000000000..4dde30434e
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/DMSans/DMSans-SemiBold.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/DMSans/stylesheet.css b/tools/tenscan/frontend/styles/fonts/DMSans/stylesheet.css
new file mode 100644
index 0000000000..7367dcc84a
--- /dev/null
+++ b/tools/tenscan/frontend/styles/fonts/DMSans/stylesheet.css
@@ -0,0 +1,47 @@
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-BlackItalic.ttf") format("truetype");
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-Bold.ttf") format("truetype");
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-Light.ttf") format("truetype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-Regular.ttf") format("truetype");
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-Medium.ttf") format("truetype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "DMSans";
+  src: url("DMSans-SemiBold.ttf") format("truetype");
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Bold.ttf b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Bold.ttf
new file mode 100644
index 0000000000..07d5127c04
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Bold.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Light.ttf b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Light.ttf
new file mode 100644
index 0000000000..800531084f
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Light.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Medium.ttf b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Medium.ttf
new file mode 100644
index 0000000000..f4634cd7c3
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Medium.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Regular.ttf b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Regular.ttf
new file mode 100644
index 0000000000..60323ed6ab
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-Regular.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-SemiBold.ttf b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-SemiBold.ttf
new file mode 100644
index 0000000000..52059c3a3d
Binary files /dev/null and b/tools/tenscan/frontend/styles/fonts/Quicksand/Quicksand-SemiBold.ttf differ
diff --git a/tools/tenscan/frontend/styles/fonts/Quicksand/stylesheet.css b/tools/tenscan/frontend/styles/fonts/Quicksand/stylesheet.css
new file mode 100644
index 0000000000..4a585442d8
--- /dev/null
+++ b/tools/tenscan/frontend/styles/fonts/Quicksand/stylesheet.css
@@ -0,0 +1,39 @@
+@font-face {
+  font-family: "Quicksand";
+  src: url("Quicksand-Bold.ttf") format("truetype");
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Quicksand";
+  src: url("Quicksand-Light.ttf") format("truetype");
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Quicksand";
+  src: url("Quicksand-Regular.ttf") format("truetype");
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Quicksand";
+  src: url("Quicksand-Medium.ttf") format("truetype");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Quicksand";
+  src: url("Quicksand-SemiBold.ttf") format("truetype");
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
diff --git a/tools/tenscan/frontend/styles/fonts/README.txt b/tools/tenscan/frontend/styles/fonts/README.txt
deleted file mode 100644
index 97bc71d023..0000000000
--- a/tools/tenscan/frontend/styles/fonts/README.txt
+++ /dev/null
@@ -1,4 +0,0 @@
-To learn more about the font family and its license, visit https://www.fontmirror.com/cloud-soft
-
-License: Free for personal use.
-This is a preview font for testing, you can purchase its full version at https://sellfy.com/p/Mrb3/.
\ No newline at end of file
diff --git a/tools/tenscan/frontend/styles/globals.css b/tools/tenscan/frontend/styles/globals.css
index 3f8effde11..5e03f76d5f 100644
--- a/tools/tenscan/frontend/styles/globals.css
+++ b/tools/tenscan/frontend/styles/globals.css
@@ -2,17 +2,8 @@
 @tailwind components;
 @tailwind utilities;
 
-@font-face {
-  font-family: "CloudSoft";
-  font-weight: 400;
-  src: url("./fonts/CloudSoft-Light_300.otf") format("opentype");
-}
-
-@font-face {
-  font-family: "CloudSoft";
-  font-weight: 700;
-  src: url("./fonts/CloudSoft-Bold_700.otf") format("opentype");
-}
+@import "./fonts/DMSans/stylesheet.css";
+@import "./fonts/Quicksand/stylesheet.css";
 
 @layer base {
   :root {
@@ -99,30 +90,14 @@
     @apply border-border;
   }
 
-  @font-face {
-    font-family: "CloudSoft";
-    font-weight: 400;
-    src: url("./fonts/CloudSoft-Light_300.otf") format("opentype");
-  }
-
-  @font-face {
-    font-family: "CloudSoft";
-    font-weight: 500;
-    src: url("./fonts/CloudSoft-Bold_700.otf") format("opentype");
-  }
-
-  @font-face {
-    font-family: "CloudSoft";
-    font-weight: 700;
-    src: url("./fonts/CloudSoft-Bold_700.otf") format("opentype");
-  }
-
   html {
-    font-family: "CloudSoft", sans-serif;
+    font-family: "DMSans", sans-serif;
   }
+
   body {
     @apply bg-background text-foreground;
     font-feature-settings: "rlig" 1, "calt" 1;
+    font-family: "DMSans", sans-serif;
   }
 
   h1,
@@ -132,6 +107,7 @@
   h5,
   h6 {
     font-weight: 500;
+    font-family: "Quicksand", cursive;
   }
 
   /* styles for docs */