Drawer Kit 360

Drawer Kit 360 — A True 4-Direction Drawer System for Framer

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.

⭐ Key Features

• 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

⚡ Use Cases

• 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.

🔧 Customizable Controls

• Direction: Top / Bottom / Left / Right

• Overlay color & opacity

• Drawer handle visibility

• Close button toggle + styling

• Drawer width / height

• Drag gestures + animation damping

🛠 Setup

1. Drop the drawer component into your canvas

2. Choose the slide direction (Top / Bottom / Left / Right)

3. Attach a trigger component to open the drawer

4. Attach your content component inside the drawer panel

5. Publish — you're ready to use it

   

No external code. No setup complexity.Just open → slide → close.