Glass Sheet

Floating side sheet, or a drag-to-dismiss bottom drawer with side="bottom".

Library

Opaline

Framework

React

Type

ui

License

MIT

Dependencies

@hugeicons/core-free-icons, @hugeicons/react, radix-ui

Install

npx shadcn@latest add @opaline/theme @opaline/glass-sheet

Files

• registry/opaline/ui/opaline/glass-sheet.tsx
• registry/opaline/ui/opaline/liquid-glass.tsx
• registry/opaline/lib/glass-refraction.ts
• lib/utils.ts

Source

https://github.com/deepraj21/opaline

Categories

• Bottom Sheet Components
• React Bottom Sheet Components
• Tailwind CSS Bottom Sheet Components
• Animated Bottom Sheet Components
• Drawer Components
• React Drawer Components
• Tailwind CSS Drawer Components
• Animated Drawer Components
• Overlay Components
• React Overlay Components
• Tailwind CSS Overlay Components
• Animated Overlay Components

More from Opaline

• Glass Accordion
• Glass Alert
• Glass Badge
• Glass Bento Grid
• Glass Button
• Glass Card
• Glass Clock
• Glass Code Block
• Glass Command
• Glass Context Menu
• Glass Control Center
• Glass Credit Card