Blocks · Timelines
Timelines
Vertical, horizontal, orbital, milestone, roadmap. Anchor your changelog or company story. Cosmic variants for storytelling, flare for process and roadmap utility.
Cosmic variants
Vertical Rail
time-cosmic-1
Classic vertical timeline rail with cosmic-tier markers.
Horizontal
time-cosmic-2
Horizontal timeline with snap-scroll milestones.
Arc
time-cosmic-3
Curved-arc layout for narrative timelines.
Dot-Nav
time-cosmic-4
Dot-row navigation jumps between dated panels.
Chapters
time-cosmic-5
Chapter-headed timeline; long-form story groupings.
Orbital
time-cosmic-6
Events orbit a center node; CSS-driven rotation.
Flare variants
Horizontal Snap
time-flare-horizontal-snap
Snap-scroll horizontal timeline for changelogs.
Orbit Radial
time-flare-orbit-radial
Radial layout — events orbit a central hub.
Process Steps
time-flare-process-steps
Numbered process-step timeline.
Roadmap Quarterly
time-flare-roadmap-quarterly
Quarterly-bucketed roadmap layout.
Scroll Progress
time-flare-scroll-progress
Scroll-tied progress line marks current position.
Tabs Era
time-flare-tabs-era
Era-tabbed timeline switcher (decade/release).