Foundations
Shape & Effects
Soft geometry over a dark void: generous rounding, frosted glass, and glow instead of grey shadows.
sm · 8px
chips, wells
md · 12px
inputs, list rows
lg · 16px
cards, panels
xl · 24px
modals
2xl · 32px
feature cards
pill · ∞
buttons, toggles
Rounding grows with the element: small things are gently soft, feature surfaces are unmistakably round.
Three ingredients, always together: a dark 145° gradient, a 12px backdrop blur, and a hairline of light.
Raised
shadow-raised · resting cards
Floating — hover me
shadow-floating · translateY(-8px) · scale(1.01)
Two levels only. Raised is the resting state; floating is the hover state, reached with the spring easing and a deeper shadow.
ORBA's replacement for coloured shadows: light leaking from live elements. Soft for resting accents, strong for the active moment, knob for controls.
opaque grey + drop shadow
glass + hairline ✓
No opaque grey panels, no classic material drop-shadows. Depth is darkness plus hairlines of light.