Skip to content
pinkpixel-devPublic

Repository files navigation

Flikka

Flikka

The screen recorder your AI agent edits, built for Linux.

npm version AUR version Apache 2.0

Flikka records your screen, a window, a browser tab or a terminal, then lets you (or your AI coding agent) edit the result with plain commands instead of a timeline. Idle time gets cut and clicks get zoomed automatically, so a fresh recording already renders into a decent video. From there you can speed parts up, change the background, add narration in a neural voice, or build a whole launch film with title cards, charts and captions.

Every command prints JSON, which is what makes it work so well with agents. An agent can open a browser, click around a real site like a person would, record itself doing it, and hand you a finished MP4.

What it does

  • Records the desktop (a display, one window, or a region you drag out) with gpu-screen-recorder, so it's fast and light even at 60 fps.
  • Records a browser that's a copy of your own, logins included. The mouse glides and text gets typed at human speed, so the video doesn't look like a bot made it.
  • Records a terminal running your real shell, with a --blur option that hides API keys and other secrets.
  • Edits automatically: cuts idle stretches, zooms in on clicks, and draws a smooth cursor with a click ripple.
  • Narrates with Kokoro neural voices, and transcribes speech with Whisper for captions.
  • Builds films: a film.json lists scenes (recordings, titles, images, stats, charts, line graphs, slides, before/after comparisons, your own React components) and the narrator's lines. Flikka times everything to the voice, adds captions and music, and checks the result for problems like frozen frames or music drowning out the voice.
  • Takes framed screenshots with a nice backdrop, copied straight to your clipboard.
  • Has a local review panel where you can watch projects, flip switches like click sounds or zoom, and re-render.

Requirements

  • Linux on x86_64 (developed on Arch and CachyOS, Wayland, PipeWire)
  • Node.js 22 or newer
  • gpu-screen-recorder for screen, window and region recording
  • A Chromium-family browser (Chrome, Chromium, Brave, Edge or Vivaldi) for browser recordings

Flikka downloads a few things by itself the first time it needs them: ffmpeg and uv if you don't have them, the DeepFilterNet noise remover, and a headless Chrome for rendering (about 100 MB, into ~/.cache/hyperframes). The first narration also sets up a Python environment with Kokoro, Whisper and PyTorch through uv, which is a few GB, so give that one a minute. Narration and transcription use your NVIDIA GPU through CUDA when it's there.

You don't have to figure out what's missing by hand, though. Once Flikka is installed, flikka doctor checks everything and prints the exact install command for your distro.

Installation

Arch Linux (AUR)

paru -S flikka

Or yay -S flikka. This pulls in ffmpeg, uv, gpu-screen-recorder and the rest as normal dependencies, and installs the app launcher system-wide.

npm

npm install -g @pinkpixel/flikka

From source

git clone https://github.com/pinkpixel-dev/flikka.git
cd flikka
npm install
node flikka app install

From a clone, app install also links the flikka command into ~/.local/bin.

After installing

Set up the desktop launcher (npm and source installs) and the agent skill:

flikka app install

Then check your system:

flikka doctor

It lists every tool Flikka uses, what each one is for, and whether it's there. Anything Flikka downloads by itself shows as "downloads on first use", and anything you need to install comes with a ready-to-paste pacman, apt or dnf command.

Quick start

Record a browser session

flikka record browser https://example.com --name signup-flow
flikka record look
flikka record click 3
flikka record type 1 "hello@example.com"
flikka record stop

look lists the page's buttons, links and fields with numbers, and click and type take those numbers (or visible text, or a CSS selector). stop prints the new project's id, something like 3f9a1c2e.

Record the screen, a window or a region

flikka record screen
flikka record window
flikka record region
flikka record stop

On Wayland, window lets you pick a window through your desktop's own picker, and region without coordinates lets you drag out an area with slurp. flikka record sources lists displays, microphones and cameras. Add --mic default, --system-audio or --camera default to record those too.

When you record a whole display or a window on Wayland, you don't have to decide about the mouse pointer up front. Flikka records the screen without it and logs where it was, then draws it when it renders, so you can turn it on or off later with the cursor overlay switch in the panel (or flikka project edit <id> --cursor off). --no-cursor still works. It just starts the pointer hidden instead of leaving it out for good.

This needs a small helper, flikka-cursor, that Flikka downloads by itself the first time you record a display, so that first recording keeps the pointer in the video like before. The first time the helper runs, your desktop asks you to pick the screen once; after that it remembers. It also needs a desktop whose screencast portal can report the pointer separately. I've tested this on COSMIC, and GNOME and KDE should work too. Regions keep the pointer in the video for now, and so does any desktop that can't do it (I believe that includes Sway and Hyprland).

Window recordings need flikka-cursor 0.2.0 or newer, and your desktop asks you to pick the window twice: once for the recording and once for the pointer. Pick the same window both times. When the pointer leaves the window, it disappears from the video until it comes back.

Record a terminal

flikka record terminal --blur 'sk-[A-Za-z0-9]+'
flikka record run "npm test"
flikka record stop

Render it

flikka project render 3f9a1c2e

The finished video lands in ~/Videos/flikka/. Videos are square (1080×1080) by default, which looks good almost everywhere.

Open the panel

flikka app panel

Or launch Flikka from your app menu. The panel shows every project, a live preview of the edit, and switches for the microphone, system audio, camera bubble, click sounds, zooms and the cursor overlay. Renders you start there wait their turn, one at a time, and show how far along they are. Press ? to see every keyboard shortcut.

If you don't want a zoom on every click, set Auto zoom to just clicks, just typing, or off, then add zooms only where you want them. Click a click or a typing burst on the timeline's Events row (or press Z near one) and pick Zoom here. To change where a zoom looks, click it on the Camera row and press the crosshair (or A). The recording opens over the player with a frame showing what the zoom will show: click or drag to move it, pick how close it gets (up to 3x), and save. Arrow keys nudge the frame and Enter saves, if you'd rather use the keyboard. On the timeline, [ and ] jump between zooms and Enter chooses the one under the playhead, so you can get to a zoom without the mouse too.

Editing a recording

Edits are flags on flikka project edit, and you can combine several in one call:

flikka project edit 3f9a1c2e --cut-silence --speed 1.5 --background sunset --preset vertical
flikka project render 3f9a1c2e

Some useful ones:

Flag What it does
--cut-idle, --cut-silence Cut still stretches, or pauses in speech
--cut start,end Cut a range (in the recording's own seconds)
--trim start,end Keep only that range
--speed 1.5 or --speed 2,start,end Speed up the whole video or one part
--ramp 0.5 Ease between speeds over half a second instead of jumping (--ramp off to jump)
--freeze at,seconds Hold one moment as a still, in silence, so the viewer can read it
--auto-zoom, --zooms on|off Zoom in on clicks, and on the field you're typing in
--zooms clicks|typing Only zoom on clicks, or only on typing
--zoom start,end,x,y[,scale] Zoom in on a spot yourself (x and y from 0 to 1)
--crop x,y,w,h Show only part of the recording (fractions, or pixels of the recording). --crop off undoes it
--spotlight start,end,x,y,w,h Dim everything except one area for a while
--callout start,end,x,y,"text" A label pointing at a spot. --step does the same with a number, counted in time order
--arrow start,end,x,y,x2,y2, --box start,end,x,y,w,h Draw an arrow, or a highlight box around something
--redact start,end,x,y,w,h[,solid] Blur an area after recording, or cover it with solid. all instead of start,end covers the whole video
--keystrokes on Show shortcuts (Ctrl+S, Enter and so on) in a corner as they're pressed
--intro "text", --outro "4,text" A title card before or after the recording (2.5 s unless you give the seconds)
--transition fade A transition at every cut instead of a hard jump: fade, wipe, slide or zoom. The video's length doesn't change
--music on or --music song.mp3 Background music, ducked under the voice. --music-volume from 0.1 to 4
--cursor on|off, --clicks on|off The drawn cursor and the click sound
--preset vertical|portrait|square|landscape Output shape. Tall videos follow the cursor
--background aurora|sunset|ocean|meadow|graphite|midnight The backdrop behind the window
--camera round=on,size=0.22,position=bottom-right The webcam bubble

flikka project help lists them all.

Editing by the time in the video

Times like "cut the part at 1:20" usually mean the finished video, which has already been cut and sped up. Flikka can show you that timeline and take edits in it directly:

flikka project timeline 3f9a1c2e
flikka project frames 3f9a1c2e --at 1:18,1:20,1:22
flikka project edit 3f9a1c2e --output-time --cut 1:20,1:25 --dry-run
flikka project edit 3f9a1c2e --output-time --cut 1:20,1:25
flikka project undo 3f9a1c2e

--trim, --freeze and --speed all take --output-time too. timeline lists the kept parts, freezes, speed ramps, cuts, zooms, clicks and spoken words in video time. frames shows those moments, stamped with both the video time and the recording time. --dry-run tells you how the length would change without saving anything, and undo steps back through earlier edits (Flikka keeps up to 50).

Sharing it

Once a video is rendered, Flikka can make other files from it without rendering again:

flikka project export 3f9a1c2e --format gif --from 0:03 --to 0:09
flikka project export 3f9a1c2e --format webm
flikka project poster 3f9a1c2e

export makes a GIF (800 px wide and 15 fps unless you pass --width and --fps) or a WebM, and works for films too. poster saves a still for a thumbnail, a little past the intro unless you give --at.

A recording can also come out in other shapes, or with no backdrop at all, without changing the project:

flikka project render 3f9a1c2e --presets square,vertical,landscape
flikka project render 3f9a1c2e --transparent

--transparent makes a WebM with an alpha channel (or --transparent mov for ProRes 4444, for video editors), with only the window, cursor and overlays, so you can layer it over something else.

To add chapters, use --chapter with a moment and a title. Labelled record mark markers count too:

flikka project edit 3f9a1c2e --output-time --chapter "0:30,Sign in"

Chapters go into the video file, and also into a .chapters.txt list next to it that you can paste into a YouTube description.

Making a film

A film is a project made of scenes, narrated by a voice. Start one, optionally with recordings you already have:

flikka project new launch --with signup-flow

That creates a film.json to fill in. Here's a small one:

{
  "voice": {"name": "af_heart"},
  "scenes": [
    {"type": "title", "title": "Meet [Flikka]", "subtitle": "Screen recording for AI agents", "say": "Meet Flikka."},
    {"type": "recording", "recording": "signup-flow", "say": "Here's the signup flow, recorded by an agent."},
    {"type": "stats", "title": "Faster renders", "stats": [{"value": "60 fps", "label": "Capture"}], "say": "It records at sixty frames a second."}
  ]
}

In titles, [words in brackets] use the accent color and *words in stars* are muted. Each scene lasts as long as its narration needs. Add "transition": "slide" (or wipe, zoom, fade) to change how scenes come in.

flikka project schema       # every film.json field, described
flikka project styles       # built-in looks (add your own in ~/.flikka/styles)
flikka project preview launch
flikka project live launch
flikka project render launch

preview gives you one picture per scene plus a layout check, which is quick. live opens the film in the panel, where it plays right away with narration and music. You can reorder scenes by dragging them, add new ones and edit each scene's fields, and it reloads every time film.json changes. render makes the video and then checks it for frozen frames, music too loud under the voice, captions too fast to read, and words a listener might mishear. Every issue comes with a timestamp and a frame to look at.

Voices

flikka voice list
flikka voice say af_heart "Testing one two three" --out test.wav
flikka voice say bf_emma "Open the [GIF](/ʤˈɪf/) folder" --speed 1.1

voice say takes say-as marks and a --speed, so you can hear how a fix sounds before you write it into a narration line.

A film picks its narrator with "voice": {"name": "..."}. Without one, it uses the default voice from Settings, which starts out as af_heart.

flikka voice list shows all 54 of Kokoro's voices with their language and Kokoro's own quality grade. The first letter of a voice's name is the language it speaks:

Letter Language Good to know
a, b American and British English The best voices by far, like af_heart and af_bella
e, f, h, i, p Spanish, French, Hindi, Italian, Brazilian Portuguese Needs espeak-ng installed
z Mandarin Chinese Its extra package downloads by itself the first time
j Japanese Run flikka voice setup japanese once first (a dictionary download of about 500 MB)

Kokoro is honest that it's thin outside English: a handful of voices per language, mostly graded C or D. They work, but don't expect af_heart quality.

Write the narration in the voice's language and the rest follows it:

  • Sentences end where that language ends them, including 。!? and the Hindi ।.
  • Japanese and Chinese captions break between words (Node's built-in word splitter finds them), up to 13 characters a line in Japanese and 16 in Chinese. A line never starts with closing punctuation or a small kana, and "too fast to read" uses a lower characters-per-second limit for them.
  • The check tells Whisper which language to listen for. Outside English it uses the small model unless you picked one in Settings, because the tiny one hears very little in other languages. The first run downloads it.
  • The "misheard words" check skips Japanese and Chinese, since there are no spaces to compare words by, and the report says so. For other languages it skips lines with numbers, because a number can come back as digits or as words.
  • flikka doctor lists espeak-ng as optional. Spanish, French, Hindi, Italian and Portuguese voices need it.
  • Japanese and Chinese text uses Noto Sans JP or SC, which ship with Flikka. Any film with that text (or a Japanese or Mandarin voice) gets the font, so titles and captions never show up as empty boxes, offline too. Latin text keeps the style's own font.

Your own voice

Flikka can also narrate in your own voice. It copies a voice from about 10 seconds of you talking, using Chatterbox Nano, and it runs entirely on your machine.

flikka voice add "My voice" --consent              # read the text it shows, for about 15 seconds
flikka voice add "My voice" --consent --from note.m4a   # or use a voice note or a video
flikka voice say "My voice" "Hello, this is my voice."

--consent is required. It's you confirming the voice is yours, or that you have permission to use it. Flikka cleans the recording, checks the words with Whisper, and keeps the best 10 seconds. Adding a voice with a name you already used replaces that voice. The panel's Voices page does the same thing, with a record button and a permission switch.

After that, your voice works anywhere a Kokoro voice does: "voice": {"name": "My voice"} in a film, --narrator "My voice" on a recording, or as the default voice in Settings. Names are matched without caring about case, so quote the ones with spaces.

A few things to know:

  • Your voices speak English only. Chatterbox Nano doesn't do other languages.
  • The first line in a run takes about 15 seconds longer while the model loads. After that, each line takes about as long as it lasts (on the GPU).
  • The first time, Flikka downloads the model (about 550 MB) into ~/.flikka/models/chatterbox, checked against the exact files that were tested.
  • It uses flikka-voice, a small helper program (about 15 MB). The AUR package installs it, and npm installs download it the first time one of your voices speaks, checked against the exact file that was tested. People who only use Kokoro's voices never download it.
  • flikka-voice needs glibc 2.38 or newer, which means roughly Ubuntu 24.04, Fedora 39, or anything newer. Kokoro's voices keep working on older systems.

CUDA for your voices

Your voices run on WebGPU by default. On an NVIDIA card they can run on CUDA instead, which was about 1.5 times faster on my 4090 and loads a few seconds quicker:

flikka voice cuda install

That installs Microsoft's CUDA plugin for ONNX Runtime into ~/.flikka/cuda. It's a 183 MB download, checked against the tested file. Settings has the same thing as a button under "Your voices run on".

It needs CUDA 13 and cuDNN 9 installed on your system. flikka voice cuda shows whether everything's there and whether CUDA is in use, and flikka app doctor lists anything missing. The "Your voices run on" setting (voice-gpu) picks auto (CUDA when it's ready, otherwise WebGPU), webgpu or cpu. If CUDA fails to start for some reason, the line still gets spoken on WebGPU.

Screenshots

flikka shot

Pick an area or a window and Flikka frames it on a backdrop, saves it to ~/Pictures/flikka, and copies it to your clipboard. --background, --plain and --from file.png change how it's made.

Using it with AI agents

flikka app install puts a Flikka skill where your agents look for them, for each one that's installed:

  • ~/.claude/skills/flikka for Claude Code
  • ~/.codex/skills/flikka for Codex
  • ~/.gemini/config/skills/flikka for Antigravity
  • ~/.agents/skills/flikka for Gemini CLI and other agents that read the shared .agents folder

Agents that aren't installed are skipped, so no empty ~/.codex shows up on a machine without Codex. The shared ~/.agents folder always gets the skill. Antigravity counts as installed when ~/.gemini/antigravity or ~/.gemini/config exists, since Gemini CLI uses ~/.gemini too.

If you only want the skill, or want it for an agent Flikka skipped, use flikka app skills. It doesn't touch the command link or the desktop entry:

flikka app skills                                # every agent installed here
flikka app skills --agent claude,antigravity     # just these, installed or not
flikka app skills --agent codex --remove         # take it back out

From a git clone the skill is linked, so edits to skills/flikka/SKILL.md show up right away. Otherwise it's copied, and running the command again after an update refreshes it. If a flikka skill folder that Flikka didn't make is already there, it's left alone.

After that, you can just ask your agent to "record yourself signing up on example.com" or "make a launch video from project 3f9a1c2e". The built-in help is written for agents too. flikka help lists every command, flikka record help gives one command's rules and examples, and flikka project edit help (or --help on any action) shows one action in full. The command pages include rules like "look before you click" and "never type passwords".

Where things live

What Where
Projects ~/.flikka/projects/<id>/
Finished videos ~/Videos/flikka/
Screenshots ~/Pictures/flikka/
Your film styles ~/.flikka/styles/
Downloaded tools ~/.flikka/bin/
Anything Flikka can rebuild ~/.cache/flikka/
Activity log ~/.flikka/trace.log

Videos and screenshots go in your desktop's own Videos and Pictures folders, so if yours are renamed or in another language (like ~/Vidéos), Flikka uses those.

You can move any of the first four rows. Open Settings in the panel, or use the CLI:

flikka app config                                # every setting, its value, and where that came from
flikka app config set videos ~/Videos/demos      # change one
flikka app config unset videos                   # back to the default

Files that are already saved stay where they are, so move them yourself if you want them together.

Settings

Everything else you might want to change lives in the same place, the panel's Settings page or flikka app config:

Setting What it does Default
videos, screenshots, projects, styles Where each kind of file goes See the table above
voice The narrator when a film doesn't name one. Any voice from flikka voice list, and its language comes with it af_heart
whisper-model The speech-to-text model that checks narration and transcribes recordings: tiny, base, small, medium or large-v3. Bigger is more accurate, and slower tiny
browser What records browser demos: auto (your default browser), google-chrome, chromium, brave, edge, vivaldi, or the path to another Chromium-based browser auto
browser-source A browser profile folder whose sign-ins the demo browser starts with That browser's own profile
browser-profile Where the demo browser keeps its own copy of the profile ~/.flikka/browser-<name>
browser-port The port Flikka uses to talk to the demo browser 9333
screenshot-command Your own tool for picking an area, with %o where it saves the PNG, like grim -g "$(slurp)" %o Picked for your desktop
panel-port Where the panel runs. Takes effect the next time it starts 9341

All of it saves to ~/.config/flikka/config.json, so the panel, the CLI and your agent always agree. Each value gets checked when you save it, so a typo in a path or a port that can't work gets refused with the reason instead of failing later.

For one run or a script, an environment variable wins over the setting: FLIKKA_VIDEOS, FLIKKA_SCREENSHOTS, FLIKKA_PROJECTS, FLIKKA_STYLES, FLIKKA_DEFAULT_VOICE, FLIKKA_WHISPER_MODEL, FLIKKA_BROWSER_APP, FLIKKA_BROWSER_SOURCE, FLIKKA_BROWSER_PROFILE, FLIKKA_BROWSER_PORT, FLIKKA_SCREENSHOT_CMD and FLIKKA_UI_PORT. The Settings page shows when one of these is in charge.

Updating and uninstalling

Update the same way you installed:

paru -Syu flikka
npm install -g @pinkpixel/flikka@latest

From a git clone, flikka app update pulls and reinstalls for you. After any update, run flikka app install once more to refresh the agent skills.

To remove the launcher and skills (your projects and videos stay):

flikka app uninstall

Troubleshooting

  • Run flikka doctor first. Most problems are a missing tool.

  • Every Flikka process writes what it's doing, with timings, to ~/.flikka/trace.log. Watching it while something runs usually shows where it's stuck:

    tail -f ~/.flikka/trace.log
  • A covered window stops updating in window recordings, so keep it visible. Browser recordings don't have this problem.

  • To hide a password or API key after recording, use --redact ...,solid. Strong blur is usually fine for names and emails, but blurred text can sometimes be partly recovered.

How it's built

Flikka is Node.js all the way down, with a little Python for the voice models. Videos are rendered with HyperFrames: each edit becomes a small web page drawn by React, and HyperFrames captures it frame by frame in a headless Chrome. Flikka mixes the sound itself with ffmpeg.

License

Apache 2.0. See LICENSE.


Made with 💖 by Pink Pixel · GitHub · Buy me a coffee · Ko-fi

Releases

Packages

Used by

Contributors

Languages