Quiet page fields, section bands and editorial contrast.
Act I // Layering
Hierarchy without chrome.
Velora replaces generic card stacking with recession, offsets and tonal states. The eye understands canvas, surface, elevated and accent as depth cues before it reads labels.
Readable modules with tonal separation instead of heavy borders.
Action and focus states derived from semantic tokens.
Act II // Motion + system
Scroll proves the system.
Timelines, stagger, modules and scene grammar are part of the same composition language. The page becomes proof of the primitives.
Zero JS Motion
Native actuators.
Entry, emphasis and state interpolation ride browser timelines with no scroll listeners in the framework core.
Scroll Reveal
Scene interpolation.
Copy, layers and rails phase together so each frame feels authored instead of triggered.
System Modules
Composable page grammar.
Cards, bands, metrics and shells scale from marketing surfaces to technical docs.
Design Tokens
Perceptual values.
OKLCH scales keep tone, contrast and interaction states coherent across themes.
Accessibility
Motion with exits.
Reduced-motion guards and semantic focus states are part of the system contract.
Layout, type and pacing carry the point of view before any screenshot appears.
Act III // Editorial frame
Publication rhythm, technical clarity and compositor-safe motion sit in one vocabulary.
Act IV // Apply
Apply the whole system.
Move from manifesto to implementation with the same tokens, motion rules and composition primitives used in these scenes.