- ☀️Light
- 🌙Dark
- 💻System
💠 Example
💻 HTML Code
💠 Example
Hidden for demo purposes. Click the button to reveal it, then use the 🔓 button to open or close it.
💻 HTML Code
⚙️ Variables CSS
| Variable | Description |
|---|---|
--sidebar-bg-color |
Background color of the sidebar. |
--sidebar-border-color |
Border color of the sidebar. |
--sidebar-border-radius |
Corner radius of the sidebar. |
--sidebar-border-style |
Border style applied to the sidebar. |
--sidebar-border-width |
Thickness of the sidebar border. |
--sidebar-padding |
Inner spacing of the sidebar content. |
--sidebar-width |
Default width of the expanded sidebar. |
--sidebar-shrink-width |
Width of the sidebar when using the shrink layout. |
--sidebar-shrink-width-reduce |
Reduced width of the sidebar when fully collapsed. |
--sidebar-shrink-padding |
Padding applied to the sidebar in shrink mode. |
--sidebar-shrink-item-gap |
Spacing between items in the shrink sidebar. |
--sidebar-shrink-content-gap |
Vertical spacing between sidebar sections in shrink mode. |
--sidebar-transition-time |
Duration of sidebar expand and collapse animations. |