diff --git a/src/assets/css/variables.sass b/src/assets/css/variables.sass
index e2335b9..e25d341 100644
--- a/src/assets/css/variables.sass
+++ b/src/assets/css/variables.sass
@@ -1 +1,3 @@
+@use 'sass:color'
+
 $background: #0f1a28
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 1490b4f..c95d77b 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -8,7 +8,6 @@ const { title } = Astro.props
     <meta charset="utf-8" />
     <link rel="icon" type="image/svg+xml" href="/favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <!-- <meta name="generator" content={Astro.generator} /> -->
     <meta name="name" content="AIO Tools" />
     <meta name="description" content="All-in-One Handy Tools for Everyone" />
     <title>{title}</title>
@@ -40,6 +39,6 @@ const { title } = Astro.props
     unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
 
   #body
-    font-family: 'Fira Code Variable', monospace
+    font-family: 'Inter'
     background-color: vars.$background
 </style>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 9fe15e5..d9bad4e 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -9,7 +9,7 @@ import { Image } from 'astro:assets'
   <main class="page">
     <section class="title--section">
       <div class="titleandlogo">
-        <Image class="titleandlogo__logo" src={aioToolsImage} alt="AIO Tools" width={90} />
+        <Image class="titleandlogo__logo" src={aioToolsImage} alt="AIO Tools" width={90} quality={80}/>
         <div class="titleandlogo__texts">
           <span class="titleandlogo__texts__title">AIO Tools</span>
           <span class="titleandlogo__texts__subtitle">All-in-One Tools for Everyone</span>