Drawer Kit 360
The simplest way to add drawers & slide-in panels to any Framer project.
Made with Workshop
Build your own component with AI
The simplest way to add drawers & slide-in panels to any Framer project.
Made with Workshop
Build your own component with AI
Transform your UI with a clean, flexible drawer that slides from Top, Bottom, Left, or Right.Perfect for navigation, settings, filters, menus, carts, and mobile-style bottom sheets — all in one component.
No modal. No popup. No clutter.Just a pure drawer experience, customizable and production-ready.
Slide from all four directions
Smooth, performance-tuned animations
Mobile + Desktop friendly
Adjustable overlay opacity + color
Optional handle + optional close button
Drag to close (like real drawers)
Bottom drawer height control (sheet-style)
Fully responsive layout
Navigation menus
Side panels
Settings & preferences
Filters & product drawers
Bottom sheet UI
Off-canvas menus
Notification pull-down
Full-width mobile drawers
One component. Infinite drawer patterns.
Direction: Top / Bottom / Left / Right
Overlay color & opacity
Drawer handle visibility
Close button toggle + styling
Drawer width / height
Drag gestures + animation damping
Drop the drawer component into your canvas
Choose the slide direction (Top / Bottom / Left / Right)
Attach a trigger component to open the drawer
Attach your content component inside the drawer panel
Publish — you're ready to use it
No external code. No setup complexity.Just open → slide → close.
