Dabble: your video player is a canvas. Paint the frame, then press play. Try it 😊

Most player skins are finished before anyone presses play. Dabble hands you the brush. The video sits on a white stretched canvas, and every viewer can paint the frame around it in their own style, or leave it blank for a cleaner look. The paint stays around the video, never on it, and steps aside completely in fullscreen, so the film always comes first.

The controls look like ink on a paper label, so they stay readable over any footage and any paint. Every icon, button, brush and paint blob was drawn for Dabble. No icon library. The four brushes take their movement from four ways of painting: Impressionist dabs, Cubist facets, drip splashes and ribbon sweeps. One button pulls a new palette from whatever scene is playing, so the paints change with the film.

And it turned out to be calming, like doodling in the margins while the film plays on.

The demo film, Dab, is original: a blank little canvas character who rolls through four colors and stays blank, until the viewer gets the brush.

For site owners: set the starting painting in your brand colors, or paint it in your colors and turn painting off.

Built on Video.js v10 from the standard components. Keyboard first, with a two-tone focus ring and 44px touch targets. Captions sit on their own label. Reduced motion, reduced transparency and forced colors are all supported, and control text measures 16.93:1. The skin starts silent by default; the demo turns on soft brush sounds while you paint.

Links: • Demo: https://dabblevideo.com • Live on a real site: https://milenawebb.com/#dabble • Code (Apache 2.0): https://github.com/milenawebb/dabble-skin • Mux playback ID: AAprZsIykh7T29gtsNk02YhBrQRHXTj14ZxbWdc498wA