Tailwind CSS Bottom Sheet Components

Dev Design Library indexes 15 Tailwind CSS bottom sheet components from 13 open-source UI libraries, with the most coming from React Spectrum, Intent UI, Rare UI, Kokonut UI and beUI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list styles its components with Tailwind CSS utility classes. Bottom sheet components belong to the Overlays group.

• SheetHeroUI · ReactSwipeable overlay with native scroll snapping, partial positions, and nested sheets
• Tailwind SheetReact Spectrum · React
• Drawercoss ui · ReactA panel that slides in from the edge of the screen with swipe gestures, snap points, and nested drawer support.
• Smooth DrawerKokonut UI · ReactCheckout bottom sheet on Vaul snap points, peeking at the total and dragging up for details.
• drawerIntent UI · Reactdrawer
• Bottom SheetbeUI · ReactVaul-inspired draggable bottom sheet with snap points, inertia and glass surface.
• Family DrawerRare UI · ReactA bottom drawer with smooth, morphing transitions between stacked views, inspired by the Family app. Built on Vaul.
• Share SheetVengeance UI · ReactAnimated share dialog with direct sharing, copy-link feedback, and a downloadable QR code
• Bottom SheetPanel UI · React NativeDraggable sheet anchored to the bottom of the screen.
• SheetUI Lab · ReactDrag it down or flick it away; pull it up and it pushes back.
• DrawerD2Studio UI · ReactA drawer component that slides in from the bottom or sides of the screen.
• DrawerEaseUI · ReactSheet that slides up from the bottom edge on the native dialog element. Drag the handle down, or flick it, to dismiss.
• Glass SheetOpaline · ReactFloating side sheet, or a drag-to-dismiss bottom drawer with side="bottom".
• Vanilla SheetReact Spectrum · React
• sheetIntent UI · Reactsheet

Libraries with Tailwind CSS bottom sheet components

• React Spectrum
• Intent UI
• Rare UI
• Kokonut UI
• beUI

Related categories

• Bottom Sheet Components
• React Bottom Sheet Components
• Animated Bottom Sheet Components
• Tailwind CSS Overlay Components
• Tailwind CSS Modal Components
• Tailwind CSS Popover Components
• Tailwind CSS Tooltip Components
• Tailwind CSS Toast Components
• Tailwind CSS Drawer Components
• Tailwind CSS Alert Dialog Components
• Tailwind CSS Hover Card Components
• Tailwind CSS Tour Components
• Tailwind CSS Dynamic Island Components
• Tailwind CSS Cookie Banner Components
• Tailwind CSS Lightbox Components