diff --git a/packages/ui/src/components/index.ts b/packages/ui/src/components/index.ts
index a9014d9578..d64dc77da8 100644
--- a/packages/ui/src/components/index.ts
+++ b/packages/ui/src/components/index.ts
@@ -96,5 +96,7 @@ export * from './ui/button'
 export * from './ui/command'
 export * from './ui/dialog'
 export * from './ui/popover'
+// May group them in shadcn-io/index.ts ?
 export * from './ui/shadcn-io/dropzone'
+export * from './ui/shadcn-io/skeleton'
 export * from './ui/shadcn-io/tabs'
diff --git a/packages/ui/src/components/ui/shadcn-io/skeleton/index.tsx b/packages/ui/src/components/ui/shadcn-io/skeleton/index.tsx
new file mode 100644
index 0000000000..ba70fc8337
--- /dev/null
+++ b/packages/ui/src/components/ui/shadcn-io/skeleton/index.tsx
@@ -0,0 +1,7 @@
+import { cn } from '@cherrystudio/ui/utils'
+
+function Skeleton({ className, ...props }: React.ComponentProps<'div'>) {
+  return <div data-slot="skeleton" className={cn('bg-accent animate-pulse rounded-md', className)} {...props} />
+}
+
+export { Skeleton }