diff --git a/tailwind.config.ts b/tailwind.config.ts
index 2e4a6785..3e9e2f01 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -1,9 +1,9 @@
 import { Config } from "tailwindcss"
 import {
   createVariableColors,
+  getDefaultColors,
   variableColorsPlugin,
 } from "tailwindcss-variable-colors"
-import { default as alwaysColor } from "tailwindcss/colors"
 
 import { addDynamicIconSelectors } from "@iconify/tailwind"
 
@@ -12,7 +12,7 @@ const config: Config = {
   safelist: ["icon-[mingcute--link-line]", "icon-[mingcute--copy-2-line]"],
   darkMode: ["class", "html.dark"],
   theme: {
-    colors: createVariableColors(alwaysColor),
+    colors: createVariableColors(),
     extend: {
       boxShadow: {
         modal: `rgb(0 0 0 / 20%) 0px 0px 1px, rgb(0 0 0 / 20%) 0px 20px 40px`,
@@ -24,7 +24,7 @@ const config: Config = {
         border: "var(--border-color)",
         accent: "var(--theme-color)",
         hover: "var(--hover-color)",
-        always: alwaysColor as any,
+        always: getDefaultColors() as any,
       },
       spacing: {
         sidebar: `240px`,
@@ -80,7 +80,7 @@ const config: Config = {
     require("tailwindcss-animate"),
     require("tailwind-scrollbar-hide"),
     addDynamicIconSelectors(),
-    variableColorsPlugin(alwaysColor),
+    variableColorsPlugin(),
   ],
 }