Video.js v10 skin · Sheet 01
Blueprint
A video player drawn like a technical drawing: the timeline is a dimension line, the scrubber is a registration target, the time and speed sit in title-block cells. Navy sheet, cyan linework, one redline accent.
Test over
01 · Concept
Players usually hide their engineering. Blueprint shows it. Every control is drawn in the language of a drafting sheet, so the player feels precise and calm instead of glossy.
02 · Details
- Timeline as a dimension line, with arrowheads, extension lines and tick marks every 10%.
- Scrubber as a crosshair target; hovering draws a leader line up to a time callout.
- Corner registration marks and a drawing-number tag frame the picture.
- Playback speed reads as the drawing's scale, 1:1.5.
03 · Usable for everyone
- Solid panels with a scrim stay readable over bright and dark footage.
- Keyboard: Space/K, J/L, arrows, M, F, C, I, 0–9. One visible focus ring everywhere.
- 44px targets and a 32px-tall timeline hit area for thumbs.
- Container queries for small players; motion collapses with reduced motion; forced-colours support.