Video Ring is a BuiltByKern micro hero controller: your video fills the frame while a circular play/pause control tracks progress on a radial ring. Autoplay, loop, and mute when you need them; pause when offscreen or the tab is hidden. Fit cover/contain/fill, corner placement, blur glass button, and a keyboard focus accent. Canvas-safe static progress and reduced-motion aware. Zero external packages beyond Framer. Desktop click/tap is the product — no auto-demo.
Components · Video · Media · Interaction · Hover · Motion · Hero
Floating play/pause control with radial timeline ring
Progress from currentTime / duration (smooth, no janky re-renders)
Autoplay / loop / muted + pause offscreen / tab hidden
Object prop groups: Media · Playback · Appearance · Control
Corner placement + inset · Fit · blur glass · veil
Keyboard focus accent · play/pause labels · aria-pressed
Canvas / export static preview + reduced-motion safe
Zero external dependencies beyond Framer
No Auto Demo — interaction is the product
BuiltByKern
Video Ring is a BuiltByKern micro hero controller: your video fills the frame while a circular play/pause control tracks progress on a radial ring. Autoplay, loop, and mute when you need them; pause when offscreen or the tab is hidden. Fit cover/contain/fill, corner placement, blur glass button, and a keyboard focus accent. Canvas-safe static progress and reduced-motion aware. Zero external packages beyond Framer. Desktop click/tap is the product — no auto-demo.
Components · Video · Media · Interaction · Hover · Motion · Hero
Floating play/pause control with radial timeline ring
Progress from currentTime / duration (smooth, no janky re-renders)
Autoplay / loop / muted + pause offscreen / tab hidden
Object prop groups: Media · Playback · Appearance · Control
Corner placement + inset · Fit · blur glass · veil
Keyboard focus accent · play/pause labels · aria-pressed
Canvas / export static preview + reduced-motion safe
Zero external dependencies beyond Framer
No Auto Demo — interaction is the product
BuiltByKern
