component
Contour Timeline
By Matt

Details
- MattAuthor
- componentType
- $8.00Price
- 2026-09-13Published
- 2026-09-13Updated
- 2026-09-13Added
- InteractiveCategories
Summary
About Contour Timeline is an interactive horizontal timeline for Framer, built for company histories, product milestones, and portfolio journeys.
Description
About Contour Timeline is an interactive horizontal timeline for Framer, built for company histories, product milestones, and portfolio journeys. An animated line curves beneath the selected milestone, revealing an optional image-and-text card. Visitors can explore through hover, click, or a touch-friendly layout, with linked cards leading to related projects and stories. Keyboard controls and reduced-motion support are included. What you can customize Built as a Framer code component with easy property controls. Add up to 30 milestones and customize years, labels, titles, descriptions, images, links, typography, colors, and card styling. Adjust the curve, spacing, motion, starting item, hover or click behavior, navigation arrows, and compact layout breakpoint. Show or hide images and details without editing code. Great for (examples) Just a few ideas, use it anywhere you want to make a sequence easier to explore: Company history, brand heritage, and founding stories Product milestones and manually updated roadmaps Career journeys, experience, and achievements Portfolio projects and case-study navigation Project phases and development stories Agency growth and studio anniversaries Research milestones and innovation histories Personal journeys and creative retrospectives Share your build If you ship something cool with it, post it on X and tag me @Matthias_Oel , or send it over. I’d love to see what you create. Need help? Questions or feedback? Reach me anytime: matthias@lmvision.de or on X @Matthias_Oel. Need a matching component? Show more of your work with Real Folder or MacBook Reveal . Explore all components →
Introduction
Give every milestone its moment
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #194