Video editor & screen recorder. A studio, no servers.

How to use the Video Editor & Screen Recorder

This studio records your screen, webcam and voice, lets you cut the clips together on a multi-track timeline, and exports the result as a WebM video. Every frame is drawn on a canvas in your browser and the export records that canvas in real time, so nothing is uploaded. It suits tutorials, product demos, bug reports and short social clips. It works best in a current desktop Chrome, Edge or Firefox.

Step by step

1. 1
   Set up the canvas

   In the top bar next to Canvas, pick the shape (16:9, 9:16, 1:1 or 4:3), the resolution (480p, 720p or 1080p), the frame rate (24 or 30 fps) and a background color. The defaults are 16:9, 720p, 30 fps and black. With nothing selected, the side panel next to the preview, headed Project, shows the same settings.

2. 2
   Record or import your media

   Press Screen to record a screen, window or tab; leave + mic ticked to mix in your microphone. Press Webcam for a camera clip or Voice for a voiceover. A timer runs while you record; press Stop when done. To import instead, drop video, audio or image files anywhere on the page, or click the box under Media bin.

3. 3
   Get clips onto the timeline

   Screen recordings are added at the end of the timeline on the first video track. Webcam clips go on the overlay track at the playhead, as picture-in-picture. Voiceovers go on the audio track at the playhead. For imported files, press the + button next to an item in the Media bin: video and images join the end of the timeline, audio lands at the playhead. Images start at 4 seconds long.

4. 4
   Arrange and cut

   Drag a clip to move it and drag its edges to trim it. Press Split, or S, to cut the selected clip at the playhead. Right-click a clip for Split at playhead, Duplicate, Detach audio, Mute audio and Delete; the two audio items only show for clips with sound. Snap lines clips up with edges and the playhead; Zoom and Fit change how much of the timeline you see. Press + Track to add another video, audio or callout track.

5. 5
   Fine tune a clip

   Select a clip to edit it in the side panel next to the preview. Set Start (s), Duration (s) and Fade in and Fade out up to 2 seconds. Video and audio clips also get a Speed from 0.25× to 3× and Volume from 0 to 200%. Under Look, choose a Filter preset such as Black & white, Vintage or Warm and set its Filter intensity. Clips on an upper video track also get Position X, Position Y, Size and corner presets.

6. 6
   Add callouts

   Under Callout, press T for a text label, the arrow, the blur box or the spotlight. Each one is added at the playhead for 4 seconds. Select it to change its text, colors, position, size, blur strength or dim amount in the side panel, which is headed Callout.

7. 7
   Preview your edit

   Press Play or the Space bar to watch the timeline. Use the arrow keys to step one frame, or Shift with an arrow to jump one second. Press PNG to save the frame under the playhead as an image. Press ? for the full list of shortcuts.

8. 8
   Export and save

   Press Export video. The timeline plays through once in real time while it records, so a 60 second edit takes about 60 seconds; keep the tab in front. When it finishes, press Download .webm. Press Save to download the project as a JSON file you can reopen later with Open.

Reading the result

• The clock under the preview shows the playhead time and the total length, for example 0:12.5 / 1:04.0.
• With nothing selected, the Project panel sums up the edit: the number of clips, the total length and the output size, such as 1280×720 for 16:9 at 720p.
• When an export finishes, the summary above the preview player shows the file size, the length and WebM with the output width and height. The video bitrate is set from the resolution: 2.5 Mbps at 480p, 5 Mbps at 720p and 8 Mbps at 1080p.
• A media item marked missing, re-import has no file attached, which happens after Restore session or Open because media is never stored. Drop the same file again and it relinks by file name.

Tips and common mistakes

• Hidden and muted tracks are left out of the export. Check the eye and speaker buttons in each track header before you export.
• Detach audio puts the sound on its own track and mutes the original clip, so you can trim or move the sound without hearing it twice.
• Press Save before you close the tab. The page remembers your timeline, but never the media files themselves, so keep the original files with the project JSON.
• The export is a WebM file. If you need MP4 for a platform that will not take WebM, convert it with the Video Trim & GIF tool.
• Ctrl+Z undoes and Ctrl+Y or Ctrl+Shift+Z redoes. The history keeps the last 40 states of your edit.

Privacy and limits

Recording, editing and export all run in your browser, and no media is uploaded. Your timeline layout and settings, but not the media, are autosaved in this browser's localStorage so a Restore session banner can offer them next time; Start fresh clears that. The studio needs MediaRecorder, canvas capture and Web Audio, so Safari support is limited. Files over 800 MB still load but trigger a warning that they can be slow.

Back to the tool

Everything a screen studio should do.

• Record your screen, webcam and voiceover straight into the timeline, with your microphone mixed into screen captures. If you only need the screen and no timeline, the free screen recorder saves a .webm straight to your device with no time limit.
• Edit on a real multi-track timeline: drag clips to move them, drag the edges to trim, split at the playhead, duplicate and delete.
• Drag and drop video, audio or image files anywhere on the page to import them instantly into the media bin.
• Detach audio from any video clip onto its own track, so you can move, trim or delete the sound on its own.
• Add callouts, text labels, arrows, blur regions and spotlights, plus per-clip speed, volume, fades, colour looks and picture-in-picture.
• Export to a WebM video or save a single frame as a PNG, all without anything leaving your device.

Frequently asked questions.

More media tools.

Browse the full free-tool library →