diff --git a/src/components/Environment/EnvironmentCards.vue b/src/components/Environment/EnvironmentCards.vue
index 5f8a7bb..e743dcc 100644
--- a/src/components/Environment/EnvironmentCards.vue
+++ b/src/components/Environment/EnvironmentCards.vue
@@ -21,7 +21,7 @@
           </div>
 
           <div>
-            <button type="button" class="flex items-center justify-between text-white pl-1 bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline text-sm w-full text-left">
+            <button type="button" class="flex items-center justify-between text-white pl-1 bg-blue hover:bg-blue-darker focus:bg-blue-darker focus:outline-none focus:underline text-sm w-full text-left">
               <svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
               <span class="flex-1">Code</span>
               <span class="border-l border-grey p-2">
@@ -29,7 +29,7 @@
               </span>
             </button>
 
-            <button type="button" class="flex items-center justify-between text-white pl-1 bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline text-sm w-full text-left border-t border-grey">
+            <button type="button" class="flex items-center justify-between text-white pl-1 bg-blue hover:bg-blue-darker focus:bg-blue-darker focus:outline-none focus:underline text-sm w-full text-left border-t border-grey">
               <svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
               <span class="flex-1">Databases</span>
               <span class="border-l border-grey p-2">
@@ -37,7 +37,7 @@
               </span>
             </button>
 
-            <button type="button" class="flex items-center text-white bg-blue-light hover:bg-blue-dark focus:bg-blue-dark focus:outline-none focus:underline px-1 py-3 text-sm w-full text-left border-t border-grey">
+            <button type="button" class="flex items-center text-white bg-blue hover:bg-blue-darker focus:bg-blue-darker focus:outline-none focus:underline px-1 py-3 text-sm w-full text-left border-t border-grey">
               <svg class="h-6 w-5 text-white mr-2 fill-current" role="presentation"><use xlink:href="/img/icons.symbol.svg#objects__grip-handle"></use></svg>
               Files
             </button>
diff --git a/tailwind.js b/tailwind.js
index 5e15f6a..6d2d1b6 100644
--- a/tailwind.js
+++ b/tailwind.js
@@ -6,7 +6,7 @@ var colors = {
   'black': '#22292f',
   'blue': '#018dc7',
   'blue-dark': '#0e68a7',
-  'blue-darker': '#002d64',
+  'blue-darker': '#004f86',
   'blue-light': '#29aae1',
   'green': '#398002',
   'grey': '#B7B7B7',