diff --git a/src/renderer/src/components/common/ErrorElement.tsx b/src/renderer/src/components/common/ErrorElement.tsx
index 230f4b5276..2f856324f3 100644
--- a/src/renderer/src/components/common/ErrorElement.tsx
+++ b/src/renderer/src/components/common/ErrorElement.tsx
@@ -100,7 +100,7 @@ export const FallbackIssue = ({
   <p className="mt-8">
     Still having this issue? Please give feedback in Github, thanks!
     <a
-      className="text-accent-500 ml-2 cursor-pointer duration-200 hover:text-accent"
+      className="ml-2 cursor-pointer text-theme-accent-500 duration-200 hover:text-accent"
       href={getNewIssueUrl({
         title: `Error: ${message}`,
         body: `### Error\n\n${message}\n\n### Stack\n\n\`\`\`\n${stack}\n\`\`\``,
diff --git a/src/renderer/src/components/ui/markdown/components/TimeStamp.tsx b/src/renderer/src/components/ui/markdown/components/TimeStamp.tsx
index 38b89a6228..24afdd36a7 100644
--- a/src/renderer/src/components/ui/markdown/components/TimeStamp.tsx
+++ b/src/renderer/src/components/ui/markdown/components/TimeStamp.tsx
@@ -10,7 +10,7 @@ export const TimeStamp = (props: { time: string }) => {
   if (!src) return <span>{props.time}</span>
   return (
     <span
-      className="dark:text-accent-500 cursor-pointer tabular-nums text-accent"
+      className="cursor-pointer tabular-nums text-accent dark:text-theme-accent-500"
       onClick={() => {
         Player.mount({
           type: "audio",
diff --git a/src/renderer/src/components/ui/switch.tsx b/src/renderer/src/components/ui/switch.tsx
index 3c80fbe7b2..378be24ca7 100644
--- a/src/renderer/src/components/ui/switch.tsx
+++ b/src/renderer/src/components/ui/switch.tsx
@@ -9,7 +9,7 @@ const Switch = React.forwardRef<
   <SwitchPrimitives.Root
     className={cn(
       "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
-      "dark:data-[state=unchecked]:bg-accent-100/10 duration-200 data-[state=checked]:bg-accent data-[state=unchecked]:bg-theme-inactive",
+      "duration-200 data-[state=checked]:bg-accent data-[state=unchecked]:bg-theme-inactive dark:data-[state=unchecked]:bg-theme-accent-100/10",
       className,
     )}
     {...props}
diff --git a/src/renderer/src/components/ui/tabs.tsx b/src/renderer/src/components/ui/tabs.tsx
index d0d4d47f2b..333ab007b9 100644
--- a/src/renderer/src/components/ui/tabs.tsx
+++ b/src/renderer/src/components/ui/tabs.tsx
@@ -55,9 +55,9 @@ const tabsTriggerVariants = cva("", {
   variants: {
     variant: {
       default:
-        "py-1.5 border-b-2 border-transparent data-[state=active]:text-accent dark:data-[state=active]:text-accent-500",
+        "py-1.5 border-b-2 border-transparent data-[state=active]:text-accent dark:data-[state=active]:text-theme-accent-500",
       rounded:
-        "py-1 rounded-sm data-[state=active]:bg-accent-300 dark:data-[state=active]:bg-accent-800 data-[state=active]:shadow-sm",
+        "py-1 rounded-sm data-[state=active]:bg-theme-accent-300 dark:data-[state=active]:bg-theme-accent-800 data-[state=active]:shadow-sm",
     },
   },
   defaultVariants: {
diff --git a/src/renderer/src/modules/feed-column/corner-player.tsx b/src/renderer/src/modules/feed-column/corner-player.tsx
index c78b6406de..3c7bb49ec4 100644
--- a/src/renderer/src/modules/feed-column/corner-player.tsx
+++ b/src/renderer/src/modules/feed-column/corner-player.tsx
@@ -259,7 +259,7 @@ const PlayerProgress = () => {
         onValueCommit={(value) => Player.seek(value[0])}
       >
         <Slider.Track className="relative h-1 w-full grow rounded bg-gray-200 duration-200 group-hover:bg-gray-300 dark:bg-neutral-700 group-hover:dark:bg-neutral-600">
-          <Slider.Range className="bg-accent-400 dark:bg-accent-700 absolute h-1 rounded" />
+          <Slider.Range className="absolute h-1 rounded bg-theme-accent-400 dark:bg-theme-accent-700" />
         </Slider.Track>
 
         {/* indicator */}
diff --git a/src/renderer/src/modules/settings/tabs/wallet/transaction-section/index.tsx b/src/renderer/src/modules/settings/tabs/wallet/transaction-section/index.tsx
index de311d04f3..9da58c0339 100644
--- a/src/renderer/src/modules/settings/tabs/wallet/transaction-section/index.tsx
+++ b/src/renderer/src/modules/settings/tabs/wallet/transaction-section/index.tsx
@@ -109,7 +109,7 @@ const TypeRenderer = ({
 }) => (
   <div
     className={cn("center rounded-full p-px text-xs uppercase", {
-      "bg-accent-700 text-white": type === "tip",
+      "bg-theme-accent-700 text-white": type === "tip",
       "bg-green-700 text-white": type === "mint",
       "bg-red-700 text-white": type === "burn",
       "bg-yellow-700 text-white": type === "withdraw",