Timeline: A Video.js Skin with an Editor-Style TimelineTimeline: A Video.js Skin with an Editor-Style Timeline
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Timeline: a Video.js skin that reads time like an editor Most players draw the progress bar as a line. Editors read time as a track, so Timeline builds one. Chapters are colored clips over the video's own frames, with a ruler above and a capped playhead. Point at the track and it opens up, like zooming in on a timeline. The playhead takes the color of the clip it's in. Time reads as timecode down to the frame. J, K and L shuttle forward and back at 1×, 2×, 4× and 8×, and comma and period step one frame. It's built on the Default skin, so controls, menus and hotkeys stay keyboard operable. The panel behind the controls is solid for contrast. Tap targets grow to 44px on coarse pointers, the track slims down on small players, and reduced motion is respected. Clip colors are tokens, so a site can swap in its own palette. In the demo they follow my 2026 reel: lime for ads, teal for product UI, violet for web, orange for 3D. The reel streams from Mux, and the filmstrip reads the storyboard track, so it works with any source that has one. Try the live demo here. https://timeline.leoreed.com The demo video is my 2026 reel, made of self-initiated pieces for fictional brands.
Denis's avatar
Reading time like an editor's track is a smart take. Chapters as clips over real frames, nice.
Leo's avatar
Thanks Denis! Try J, K and L on it, they shuttle like in Premiere.
Mohsen's avatar
The playhead taking the colour of the clip it's in is a lovely touch — the timeline doesn't just show you where you are, it tells you what kind of work you're in. And J, K and L shuttling at 1×, 2×, 4× and 8× makes the whole thing feel like a real editor, not a player dressed up...
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started