diff --git a/components/dashboard/public/gitpod.svg b/components/dashboard/public/gitpod.svg
index 089e2f88681729..83364d8fee9096 100644
--- a/components/dashboard/public/gitpod.svg
+++ b/components/dashboard/public/gitpod.svg
@@ -1,9 +1,9 @@
-<svg width="30" height="32" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M17.4744 1.57932C18.321 3.07561 17.7962 4.97595 16.3022 5.82384L7.00681 11.0992C6.51969 11.3757 6.21862 11.8931 6.21862 12.4538V20.2445C6.21862 20.8053 6.51969 21.3227 7.00681 21.5992L14.0028 25.5696C14.4782 25.8394 15.0602 25.8394 15.5357 25.5696L22.5316 21.5992C23.0188 21.3227 23.3198 20.8053 23.3198 20.2445V15.126L16.2875 19.0667C14.7889 19.9065 12.8943 19.3706 12.0558 17.8697C11.2173 16.3689 11.7524 14.4714 13.251 13.6316L23.1756 8.07016C26.0254 6.47321 29.5385 8.53628 29.5385 11.8068V20.2445C29.5385 23.0483 28.0331 25.6354 25.5975 27.0177L18.6016 30.9881C16.2243 32.3373 13.3142 32.3373 10.9369 30.9881L3.94095 27.0177C1.50533 25.6354 0 23.0483 0 20.2445V12.4538C0 9.65009 1.50534 7.06293 3.94096 5.68065L13.2363 0.405298C14.7303 -0.4426 16.6278 0.0830259 17.4744 1.57932Z" fill="url(#paint0_linear)"/>
-<defs>
-<linearGradient id="paint0_linear" x1="12.8547" y1="12.5407" x2="5.8643" y2="29.3237" gradientUnits="userSpaceOnUse">
-<stop stop-color="#FFAD33"/>
-<stop offset="1" stop-color="#FF8A00"/>
-</linearGradient>
-</defs>
+<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M18.748 1.594a3.16 3.16 0 01-1.178 4.313l-9.437 5.387a.8.8 0 00-.403.695v8.456a.8.8 0 00.403.695l7.47 4.264a.8.8 0 00.794 0l7.47-4.264a.8.8 0 00.403-.695v-5.259l-6.715 3.785a3.167 3.167 0 01-4.312-1.2 3.16 3.16 0 011.202-4.308l9.607-5.415c2.927-1.65 6.548.463 6.548 3.82v9.22a6.016 6.016 0 01-3.035 5.224l-8.576 4.895a6.03 6.03 0 01-5.978 0l-8.576-4.895A6.016 6.016 0 011.4 21.087v-9.74a6.016 6.016 0 013.035-5.225L14.43.417a3.167 3.167 0 014.318 1.177z" fill="url(#paint0_linear)"/>
+  <defs>
+    <linearGradient id="paint0_linear" x1="23.378" y1="4.839" x2="8.413" y2="28.391" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFB45B"/>
+      <stop offset="1" stop-color="#FF8A00"/>
+    </linearGradient>
+  </defs>
 </svg>
diff --git a/components/dashboard/src/components/Menu.tsx b/components/dashboard/src/components/Menu.tsx
index 0286b47615aa42..aa08cf30278dee 100644
--- a/components/dashboard/src/components/Menu.tsx
+++ b/components/dashboard/src/components/Menu.tsx
@@ -7,11 +7,11 @@ interface Entry {
 }
 
 function MenuItem(entry: Entry) {
-    let classes = "flex block text-sm font-medium lg:px-3 px-0 py-2 rounded-md";
+    let classes = "flex block text-sm font-medium lg:px-3 px-0 py-1.5 rounded-md";
     if (window.location.pathname.toLowerCase() === entry.link.toLowerCase()) {
         classes += " bg-gray-200";
     } else {
-        classes += " text-gray-500 hover:bg-gray-300 ";
+        classes += " text-gray-600 hover:bg-gray-100 ";
     }
     return <li key={entry.title}>
         {entry.link.startsWith('https://')
@@ -57,7 +57,7 @@ function Menu(props: { left: Entry[], right: Entry[] }) {
                         {props.right.map(MenuItem)}
                     </ul>
                 </nav>
-                <Link className="lg:ml-4 flex items-center justify-start lg:mb-0 mb-4 pointer-cursor m-l-auto rounded-full border-2 hover:border-gray-400 p-0.5" to="/account">
+                <Link className="lg:ml-3 flex items-center justify-start lg:mb-0 mb-4 pointer-cursor m-l-auto rounded-full border-2 border-white hover:border-gray-200 p-0.5" to="/account">
                     <img className="rounded-full w-6 h-6"
                         src={user?.avatarUrl || ''} alt={user?.name || 'Anonymous'} />
                 </Link>
diff --git a/components/dashboard/src/tailwind.output.css b/components/dashboard/src/tailwind.output.css
index 52c1aa2a30afce..2bb662442eb57b 100644
--- a/components/dashboard/src/tailwind.output.css
+++ b/components/dashboard/src/tailwind.output.css
@@ -365,7 +365,7 @@ ul {
  */
 
 html {
-  font-family: Inter, Helvetica, Arial, sans-serif; /* 1 */
+  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; /* 1 */
   line-height: 1.5; /* 2 */
 }
 
@@ -12671,7 +12671,7 @@ input[type=text]::placeholder {
 }
 
 .font-sans {
-  font-family: Inter, Helvetica, Arial, sans-serif !important;
+  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
 }
 
 .font-thin {
@@ -46975,7 +46975,7 @@ input[type=text]::placeholder {
   }
 
   .sm\:font-sans {
-    font-family: Inter, Helvetica, Arial, sans-serif !important;
+    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
   }
 
   .sm\:font-thin {
@@ -80680,7 +80680,7 @@ input[type=text]::placeholder {
   }
 
   .md\:font-sans {
-    font-family: Inter, Helvetica, Arial, sans-serif !important;
+    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
   }
 
   .md\:font-thin {
@@ -114385,7 +114385,7 @@ input[type=text]::placeholder {
   }
 
   .lg\:font-sans {
-    font-family: Inter, Helvetica, Arial, sans-serif !important;
+    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
   }
 
   .lg\:font-thin {
@@ -148090,7 +148090,7 @@ input[type=text]::placeholder {
   }
 
   .xl\:font-sans {
-    font-family: Inter, Helvetica, Arial, sans-serif !important;
+    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
   }
 
   .xl\:font-thin {
@@ -181795,7 +181795,7 @@ input[type=text]::placeholder {
   }
 
   .\32xl\:font-sans {
-    font-family: Inter, Helvetica, Arial, sans-serif !important;
+    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;
   }
 
   .\32xl\:font-thin {
diff --git a/components/dashboard/tailwind.config.js b/components/dashboard/tailwind.config.js
index d70144ec61e459..7195f29f969ceb 100644
--- a/components/dashboard/tailwind.config.js
+++ b/components/dashboard/tailwind.config.js
@@ -33,7 +33,22 @@ module.exports = {
             },
         },
         fontFamily: {
-            'sans': ['Inter', 'Helvetica', 'Arial', 'sans-serif'],
+          sans: [
+            'Inter',
+            'system-ui',
+            '-apple-system',
+            'BlinkMacSystemFont',
+            'Segoe UI',
+            'Roboto',
+            'Helvetica Neue',
+            'Arial',
+            'Noto Sans',
+            'sans-serif',
+            'Apple Color Emoji',
+            'Segoe UI Emoji',
+            'Segoe UI Symbol',
+            'Noto Color Emoji',
+          ],
         },
         underlineThickness: {
             'thin': '2px',