diff --git a/components/link-button.vue b/components/link-button.vue
index fc136a8..7771b77 100644
--- a/components/link-button.vue
+++ b/components/link-button.vue
@@ -4,7 +4,7 @@
         :href="href"
         :target="target"
         role="button"
-        class="relative inline-flex items-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-indigo-500 hover:bg-indigo-400 focus:outline-none focus:shadow-outline-indigo focus:border-indigo-600 active:bg-indigo-600 transition duration-150 ease-in-out"
+        class="relative inline-flex items-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-darker neumorphic-shadow hover:bg-indigo-400 focus:outline-none focus:shadow-outline-indigo focus:border-indigo-600 active:bg-indigo-600 transition duration-150 ease-in-out"
     >
         <slot />
     </a>
diff --git a/components/navbar.vue b/components/navbar.vue
index b3d5825..007a9e9 100644
--- a/components/navbar.vue
+++ b/components/navbar.vue
@@ -50,7 +50,7 @@
                             :href="item.url"
                             :class="[
                                 'px-3 py-2 rounded-md text-sm font-medium leading-5 focus:outline-none focus:text-white focus:bg-gray-700 transition duration-150 ease-in-out',
-                                ($nuxt.$route.path === item.url) ? 'text-white bg-gray-900 hover:text-white' : 'text-gray-300 hover:bg-gray-700'
+                                ($nuxt.$route.path === item.url) ? 'text-white bg-gray-900 hover:text-white' : 'text-gray-300 hover:bg-darker hover:neumorphic-shadow'
                             ]"
                         >
                             {{ item.label }}
diff --git a/layouts/default.vue b/layouts/default.vue
index 0b9ba70..b1500ed 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="app-wrapper text-gray-300 bg-gray-800">
+    <div class="app-wrapper text-gray-300 bg-gradient-to-bl from-dark to-darker bg-fixed">
         <Navbar />
         <div class="app-main min-h-screen flex items-center">
             <nuxt />
@@ -31,6 +31,8 @@ html {
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
     box-sizing: border-box;
+
+    /* background: #3e3d42; */
 }
 
 *,
diff --git a/pages/index.vue b/pages/index.vue
index fe2170b..363fdf2 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,10 +1,10 @@
 <template>
     <section class="container">
         <div class="flex flex-col items-center">
-            <h1 class="title text-6xl font-bold text-center">
-                Does it 🦾ARM?
+            <h1 class="title text-6xl font-hairline text-center">
+                Does it ARM?
             </h1>
-            <h2 class="subtitle text-xl font-bold text-center">
+            <h2 class="subtitle text-xl font-light text-center">
                 Apps that are reported to support Apple Silicon
             </h2>