Video player

A reusable component for previewing video assets within pages like the homepage or the content item screen. It includes play or pause, scrubber, volume, captions, and fullscreen. The look is sleek and modern, while shortcuts feel familiar to YouTube and Netflix.

​

Basic playback

Space → Play or pause
K → Stop playback
L → Play forward. Press repeatedly to increase speed to 2x, 4x, 8x
J → Play backward. Press repeatedly to increase reverse speed to −2x, −4x, −8x
⇧ Shift + L or ⇧ Shift + J → Slow play forward or backward at 0.5x

​

Accurate navigation

When playing ← → Seek back 5 s
→ → Seek forward 5 s When paused ← → Step back 1 frame
→ → Step forward 1 frame
⇧ Shift + ← → Step back 5 frames
⇧ Shift + → → Step forward 5 frames

​

Audio and subtitles

↑ or 🔉 ↓ → Increase or decrease volume
M → Mute or unmute
C → Toggle captions or subtitles if available

​

Display

F → Toggle fullscreen
Esc → Exit fullscreen

​

Editor tools

These controls add precision for review and editing.

• Add marker at playhead → B
• Loop between in and out → set I for in, O for out, then ; to toggle loop
• Jog or shuttle (fine control) → Hold K and tap L or J for micro stepping
• Subtitle sync offset → ⌥ Alt + , shifts subtitles −50 ms, ⌥ Alt + . shifts +50 ms
• Jump to markers → ⌥ Alt + ← previous, ⌥ Alt + → next

​

Quick reference