Under Settings → Theme → Components you fine-tune the shape and feel of the interactive pieces — buttons, inputs, cards — plus shadows and motion.
Buttons & form fields
Each has its own Border Radius and Padding X / Y:
- Buttons — radius + padding (with your Primary color from Colors).
- Inputs, Selects, Textareas — radius + padding; textareas also have a Min Height.
Cards & images
- Cards — Border Radius, Padding, resting Shadow, and Hover Shadow.
- Images — default corner Border Radius.
Shadows
Under Shadows, set the four elevation levels — SM, MD, LG, XL — as full CSS shadow values. These drive card elevation, dropdowns, and modals. Dark mode uses softer defaults automatically.
Animations
Under Animations:
- Transition Duration and Easing — the speed and curve of hover/interaction transitions.
- Enable Animations — a global on/off.
- Reduce Motion — respects visitors who prefer less motion (and the OS setting).
💡 Tip: Radius is the fastest way to shift brand feel — round buttons/cards read approachable; square reads industrial. Set it once here and it flows everywhere.
Next: Header.