Custom CSS
Customize the visual appearance by setting these custom properties on .c-drawer or :root.
Custom properties
--drawer-bg
Drawer background color
#fff
--drawer-overlay-color
Overlay background color
rgba(0,0,0,0.4)
--drawer-duration
Transition duration
0.5s
--drawer-easing
Transition easing curve
cubic-bezier(0.32,0.72,0,1)
--drawer-radius
Drawer border radius
var(--radius)
--drawer-inset
Margin from viewport edges
8px
--drawer-max-height
Maximum height for vertical drawers
92dvh
--drawer-max-width
Maximum width for horizontal drawers
24rem
--drawer-body-padding
Padding inside .c-drawer__body
var(--space-m)
--drawer-handle-width
Drag handle width
48px
--drawer-handle-height
Drag handle height
4px
--drawer-handle-color
Drag handle color
#b4b4b8
--drawer-handle-padding
Drag handle wrapper padding
1.25rem 0 1rem