diff --git a/src/components/Button.vue b/src/components/Button.vue
index 29cdbd8..39ae646 100644
--- a/src/components/Button.vue
+++ b/src/components/Button.vue
@@ -35,12 +35,16 @@ export default {
   transition: all 0.1s ease-out;
 
   font-weight: bold;
-  background-color: $sebin-hair-primary;
+  background-color: $bg-color-light;
 
   text-decoration: none;
   text-align: center;
 
-  @include button($sebin-hair-primary);
+  @include button($bg-color-light);
+
+  @include theme(dark) {
+    @include button($bg-color-dark);
+  }
 
   &:hover {
     top: -0.25em;