From a raw capture to something worth shipping.
One editor for product visuals. Import a screenshot, recording, URL, or social post, frame and style it, animate it on a timeline, then export a still or a video — all in your browser.
Capture
Product work rarely starts
with a tidy image file
Screenshots, recordings, live pages, and social posts all come in the same door. Whatever you bring becomes the same kind of canvas, so everything after this behaves identically.
Screenshot file
Drag and drop, paste from the clipboard, or pick a file.
Live website
Paste a URL and Tokokino captures the page at a device viewport.
Video and GIF
Drop a recording. Imported GIFs are re-encoded to run as video.
Social post
Paste a post link and it renders as a themeable card mockup.
Compose
Framing decides what it is
styling decides how it lands
Every treatment here is non-destructive — the original capture is kept behind each crop, frame, and filter, so nothing you try is a one-way door. Save a finished look as a preset and re-apply it across a whole set.
Device frames
iPhone, iPad, Pixel, Galaxy, MacBook, plus Safari, Chrome, and Arc chrome.
Canvas shape
Aspect ratio, padding, corner radius, border, tilt, and scale.
Backgrounds
Gradients, image packs, Unsplash, or a palette sampled from your capture.
Depth and light
Shadow types, portrait depth-of-field, backdrop patterns, 3D tilt.
Rather not start from nothing? The template picker carries ready-made compositions, several of them already animated.
ShowcaseContext
A screenshot says here it is
context says here is what matters
Labels, marks, and extra shots are what turn a picture of a screen into an explanation. Each one lives on its own layer, so you can rearrange the argument without re-cropping the evidence.
Text layers
Stroke, shadow, blend modes, and opacity on every floating label.
Images and shapes
Logos, SVGs, and 3D shapes with their own z-index and filters.
Annotations
Point at what matters on a layer that never touches the capture.
Multi-shot slots
Side by Side, Depth Duo, Fan Out, Scatter, Perspective, and more.
Animate
Motion built by describing states
not by scrubbing keyframes
Each canvas carries its own timeline. The editor eases from the committed values into whatever a clip changed, so you write the destination and it works out the path.
Clips, not keyframes
Add a clip, change properties while it is selected, and it owns them.
Easing you can drag
Linear, cubic, in, out, in-out, out-circ, or a curve you pull by hand.
Aim at one slot
Point a clip at a single capture slot instead of the whole canvas.
Video on the same track
Imported footage trims and mutes alongside the motion you built.
Export
The end of the same pipeline
not a separate render service
Stills are rasterised from the canvas you have been looking at, and video is encoded on your own machine. The file appears without a queue, a watermark negotiation, or an upload.
Stills
PNG, JPEG, or WebP at 1920, 3840, or 7680px wide.
Video
Encoded on your device with WebCodecs — no queue, no upload.
Clipboard
Copy straight out of the editor without touching the filesystem.
Share link
Publish a composition to a public page and watch the views land.
screenshot.png
Dropped on the canvas · 2560 × 1440
Tokokino
- Capture — Screenshot, URL, recording, or post
- Compose — Device frame, background, depth
- Context — Text, marks, and extra shots
- Animate — Timeline clips and easing curves
- Export — Stills, video, or a public link
launch-demo.webm
Encoded on your device · 4K · 2.4 MB
You drop in a capture.
Tokokino frames, styles, and animates it.
You export the file.
The steps stay the same whatever you are making. The jobs people point them at do not.
Use casesWhere the work happens
Opening a capture
does not upload it
Editing, rasterising, and video encoding all run in the browser, and your work in progress is stored on the device, so a reload or a dropped connection does not cost you the composition. The server side is deliberately small and always explicit: capturing a URL, fetching a social post, syncing a cloud draft, publishing a share link. In each case it is the request you made or the rendered output — never the source capture sitting on your canvas. The project is open source under AGPL-3.0, so the boundary can be read rather than trusted; see the about page or the privacy policy.
Questions
Screenshots and demos
polish that ships.
Create professional screenshots, device mockups, and animated product demos with clean framing, timeline edits, and export-ready output.