diff --git a/packages/ui/package.json b/packages/ui/package.json
index 3cb5215630..97658dac99 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -45,7 +45,6 @@
     "tailwindcss": "^4.1.13"
   },
   "dependencies": {
-    "@cherrystudio/sonner": "2.0.8",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
@@ -64,6 +63,7 @@
     "cmdk": "^1.1.1",
     "lucide-react": "^0.545.0",
     "react-dropzone": "^14.3.8",
+    "sonner": "2.0.7",
     "tailwind-merge": "^2.5.5"
   },
   "devDependencies": {
diff --git a/packages/ui/src/components/primitives/sonner.tsx b/packages/ui/src/components/primitives/sonner.tsx
index 1cce9f5e99..bb9f35adc9 100644
--- a/packages/ui/src/components/primitives/sonner.tsx
+++ b/packages/ui/src/components/primitives/sonner.tsx
@@ -1,8 +1,8 @@
-import { toast as sonnerToast, Toaster as Sonner, type ToasterProps } from '@cherrystudio/sonner'
 import { cn } from '@cherrystudio/ui/utils'
 import { cva } from 'class-variance-authority'
 import { Loader2Icon } from 'lucide-react'
 import { type ReactNode, type SVGProps, useCallback, useMemo } from 'react'
+import { toast as sonnerToast, Toaster as Sonner, type ToasterProps } from 'sonner'
 
 const InfoIcon = ({ className }: SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
@@ -301,7 +301,9 @@ interface ToastProps {
 }
 
 function toast(props: Omit<ToastProps, 'id'>) {
-  return sonnerToast.custom((id) => <Toast id={id} {...props} />)
+  return sonnerToast.custom((id) => <Toast id={id} {...props} />, {
+    classNames: { toast: props.coloredBackground ? 'backdrop-blur-md rounded-xs' : undefined }
+  })
 }
 
 interface QuickApiProps extends Omit<ToastProps, 'type' | 'id'> {}
@@ -361,7 +363,7 @@ const toastColorVariants = cva(undefined, {
   }
 })
 
-const toastBgColorVariants = cva('backdrop-blur-md', {
+const toastBgColorVariants = cva(undefined, {
   variants: {
     type: {
       info: 'bg-blue-500/10 border-blue-500/20',
diff --git a/yarn.lock b/yarn.lock
index e3a8fa380e..22df2fa4f5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2213,21 +2213,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@cherrystudio/sonner@npm:2.0.8":
-  version: 2.0.8
-  resolution: "@cherrystudio/sonner@npm:2.0.8"
-  peerDependencies:
-    react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
-    react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
-  checksum: 10c0/72ede2ba41eeeb71011ba1bfaef64738935e1fcd6ff82f19d5fcac164f964be399849ff38a505b30f2ea05466880770c9512411f8a609c6844d550f577505d27
-  languageName: node
-  linkType: hard
-
 "@cherrystudio/ui@workspace:*, @cherrystudio/ui@workspace:packages/ui":
   version: 0.0.0-use.local
   resolution: "@cherrystudio/ui@workspace:packages/ui"
   dependencies:
-    "@cherrystudio/sonner": "npm:2.0.8"
     "@dnd-kit/core": "npm:^6.3.1"
     "@dnd-kit/modifiers": "npm:^9.0.0"
     "@dnd-kit/sortable": "npm:^10.0.0"
@@ -2266,6 +2255,7 @@ __metadata:
     react: "npm:^19.0.0"
     react-dom: "npm:^19.0.0"
     react-dropzone: "npm:^14.3.8"
+    sonner: "npm:2.0.7"
     storybook: "npm:^10.0.5"
     styled-components: "npm:^6.1.15"
     tailwind-merge: "npm:^2.5.5"
@@ -27912,6 +27902,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"sonner@npm:2.0.7":
+  version: 2.0.7
+  resolution: "sonner@npm:2.0.7"
+  peerDependencies:
+    react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+    react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  checksum: 10c0/6966ab5e892ed6aab579a175e4a24f3b48747f0fc21cb68c3e33cb41caa7a0eebeb098c210545395e47a18d585eb8734ae7dd12d2bd18c8a3294a1ee73f997d9
+  languageName: node
+  linkType: hard
+
 "source-map-js@npm:^1.0.1, source-map-js@npm:^1.2.0, source-map-js@npm:^1.2.1":
   version: 1.2.1
   resolution: "source-map-js@npm:1.2.1"