diff --git a/src/components/popups/ShareButtonPopup.vue b/src/components/popups/ShareButtonPopup.vue
index 95d7f06..aa3db1e 100644
--- a/src/components/popups/ShareButtonPopup.vue
+++ b/src/components/popups/ShareButtonPopup.vue
@@ -73,7 +73,7 @@ export default {
 
 <template>
     <div class="fixed top-0 bottom-0 left-0 right-0 flex w-full z-50 h-[100vh] bg-opacity-50 bg-black">
-        <div class="bg-ctp-crust my-auto h-min mx-auto w-[35rem] max-w-[95vw] p-5 rounded-md relative z-50 text-white">
+        <div class="bg-crust my-auto h-min mx-auto w-[35rem] max-w-[95vw] p-5 rounded-md relative z-50 text-white">
             <div class="flex justify-between">
                 <h1 class="text-3xl font-bold">Share</h1>
                 <button @click="$emit('close')">
@@ -81,7 +81,7 @@ export default {
                 </button>
             </div>
             <hr class="my-2" />
-            <div class="flex bg-ctp-surface0 p-3 rounded-md h-12 overflow-x-scroll whitespace-nowrap">
+            <div class="flex bg-surface0 p-3 rounded-md h-12 overflow-x-scroll whitespace-nowrap">
                 <p class="" ref="urlPreview">
                 {{ currentUrl + path + query }}
                 </p>
@@ -99,8 +99,8 @@ export default {
             </ul>
 
             <div class="space-x-2 mt-1">
-                <button class="p-2 py-1.5 bg-ctp-surface0 rounded-md" @click="copyUrl()">Copy Link</button>
-                <button class="p-2 py-1.5 bg-ctp-surface0 rounded-md" @click="gotoUrl()" >Go to</button>
+                <button class="p-2 py-1.5 bg-surface0 rounded-md" @click="copyUrl()">Copy Link</button>
+                <button class="p-2 py-1.5 bg-surface0 rounded-md" @click="gotoUrl()" >Go to</button>
             </div>
         </div>
     </div>
diff --git a/src/views/ClipView.vue b/src/views/ClipView.vue
index 6e27c57..db6ac7e 100644
--- a/src/views/ClipView.vue
+++ b/src/views/ClipView.vue
@@ -128,7 +128,7 @@ export default {
           </p>
         </div>
 
-        <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple-600">
+        <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple">
               <v-icon name="fa-share-alt"></v-icon>
             </button>
         </div>
diff --git a/src/views/UserView.vue b/src/views/UserView.vue
index 61dcc38..42b9d0d 100644
--- a/src/views/UserView.vue
+++ b/src/views/UserView.vue
@@ -175,7 +175,7 @@ export default {
             {{ abbreviate(data.followers) }} {{ $t('main.followers') }}
           </p>
 
-          <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple-600">
+          <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple">
               <v-icon name="fa-share-alt"></v-icon>
           </button>
         </div>
diff --git a/src/views/VodView.vue b/src/views/VodView.vue
index c26a0da..8d69730 100644
--- a/src/views/VodView.vue
+++ b/src/views/VodView.vue
@@ -128,7 +128,7 @@ export default {
           </div>
 
 
-            <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple-600">
+            <button @click="toggleShareModal" class="px-2 py-1.5 rounded-lg bg-purple">
               <v-icon name="fa-share-alt"></v-icon>
             </button>
         </div>