Shadcn.io is not affiliated with official shadcn/ui
Timeline Double Line
React timeline with parallel lines and cross-ties built with Next.js, shadcn/ui, and Tailwind CSS
A distinctive React and Next.js timeline component featuring two parallel vertical lines forming a railroad track with centered node markers and cross-ties. Built with TypeScript, shadcn/ui Badge component, and Tailwind CSS for precise positioning and status-based coloring. Perfect for engineering roadmaps, deployment pipelines, and technical project histories.
Related Components
Dashed Line Timeline
Soft dashed connector line with solid dot markers
Thick Rail Timeline
Bold rail backbone with horizontal connector arms
Dotted Path Timeline
Small dots forming the connecting path pattern
Gradient Cards Timeline
Subtle gradient backgrounds on timeline entry cards
Centered Spine Timeline
Bold centered vertical spine with branching entries
Compact List Timeline
Dense timeline entries in a tight list format
FAQ
Was this page helpful?
Sign in to leave feedback.