FROM THE PLAYGROUND
Folder components.
A little structure, a little personality. Frosted glass folders with stacked documents and a spring animation that brings them to life. Six colors, three sizes, ready for your next interface.
View source
ReactTypeScriptTailwind CSSshadcn/ui
Preview
Hover over a folder to see the papers fan open. Explore three sizes and six color themes below.
Small
Medium
Large
Pictures
Documents
Videos
Downloads
Archives
Trash
Installation
Run the command below to add the component to your project.
npx shadcn@latest add https://www.urmauur.com/r/folder.jsonProps
| Prop | Type | Default | Description |
|---|---|---|---|
color | string | blue | blue · black · grey · yellow · orange · red |
size | string | lg | sm · md · lg |
label | string | — | Optional text badge shown bottom-left of flap |
className | string | — | Extra classes on the root element |
KEEP EXPLORING
File card collections