Borders
Border properties used in the system.
Default Border
--border-width: 1px
--border-color: var(--color-gray-400);
--border-radius: 0.25rem
Breakpoints
Responsive breakpoints used in the system.
--breakpoint-sm: 576px
--breakpoint-md: 768px
--breakpoint-lg: 992px
--breakpoint-xl: 1200px
--breakpoint-xxl: 1400px
Shadows
Box shadow variations used in the system.
Small Shadow
--shadow-sm
Medium Shadow
--shadow-md
Large Shadow
--shadow-lg
Various Variables Reference
/* variables.css - Design Tokens */
:root {
/* Border */
--border-radius: 0.25rem;
--border-width: 1px;
--border-color: var(--color-gray-400);
/* Transitions */
--transition-base: all 0.2s ease-in-out;
/* Shadows */
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
--shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
--shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
/* Breakpoints */
--breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
}