diff --git a/web/src/styles/ui-common.scss b/web/src/styles/ui-common.scss
index 362aa42..8d6fd62 100644
--- a/web/src/styles/ui-common.scss
+++ b/web/src/styles/ui-common.scss
@@ -8,6 +8,7 @@
 
 .btn-action {
   background-color: $color2;
+  color: $color3;
   position: relative;
 
   &:hover {
diff --git a/web/src/styles/vars.scss b/web/src/styles/vars.scss
index 0f9fbe5..92f3d3a 100644
--- a/web/src/styles/vars.scss
+++ b/web/src/styles/vars.scss
@@ -7,12 +7,30 @@
 // $color4: hsla(18%, 100%, 72%, 1);
 // $color5: hsla(355%, 78%, 60%, 1);
 
+/* RGB */
+// $color1: rgba(79, 78, 77, 1);
+// $color2: rgba(27, 153, 139, 1);
+// $color3: rgba(255, 253, 130, 1);
+// $color4: rgba(255, 155, 113, 1);
+// $color5: rgba(232, 72, 85, 1);
+
+
+/* Coolors Exported Palette - coolors.co/4f4e4d-263e75-e8f1f2-b3efb2-7a9e7e */
+
+/* HSL */
+// $color1: hsla(30%, 1%, 31%, 1);
+// $color2: hsla(222%, 51%, 30%, 1);
+// $color3: hsla(186%, 28%, 93%, 1);
+// $color4: hsla(119%, 66%, 82%, 1);
+// $color5: hsla(127%, 16%, 55%, 1);
+
 /* RGB */
 $color1: rgba(79, 78, 77, 1);
-$color2: rgba(27, 153, 139, 1);
-$color3: rgba(255, 253, 130, 1);
-$color4: rgba(255, 155, 113, 1);
-$color5: rgba(232, 72, 85, 1);
+$color2: rgba(38, 62, 117, 1);
+$color3: rgba(232, 241, 242, 1);
+$color4: rgba(179, 239, 178, 1);
+//$color5: rgba(122, 158, 126, 1);
+$color5: #d83934;
 
 $fg-primary: #222;
 $bg-primary: #f0f0f0;
diff --git a/web/src/views/nav-bar.scss b/web/src/views/nav-bar.scss
index 5d288f4..e9e4c23 100644
--- a/web/src/views/nav-bar.scss
+++ b/web/src/views/nav-bar.scss
@@ -1,8 +1,8 @@
 @import '~@/styles/vars';
 
 nav {
-  background-color: $color1;
-  color: $fg-primary;
+  background-color: $color2;
+  color: $color3;
   display: flex;
   flex-direction: column;
   font-family: 'Exo 2';
@@ -26,9 +26,9 @@ nav {
     text-decoration: none;
     width: 100%;
 
-    &.router-link-active { color: $color3; }
+    &.router-link-active { color: $color4; }
 
-    &:hover { color: $color3; }
+    &:hover { color: $color4; }
 
     svg {
       display: inline-block;
@@ -37,7 +37,6 @@ nav {
   }
 
   .logo {
-    color: $color4;
     padding: 0 0 1rem;
   }