greet.js

1function greet(name) {
2  const msg = `Hello, ${name}!`;
3  console.log(msg);
4  return msg;
5}
6
7// ship it
8greet('world');

$ snapshot code greet.js --theme snazzy

From clipboard to polished image.

It is the same studio you already use for screenshots, so a code card is just another layer to frame, light, and export.

Real syntax highlighting

Thirteen languages with auto-detect, from JavaScript and Python to Go, Rust, SQL and JSON. Line numbers and tab width are yours to set.

Eight editor themes

Match your terminal or your slide deck. Switch the look in one click and the whole card recolors instantly.

A window that looks the part

Wrap the code in a macOS or Windows window with a title of your choosing, or drop the chrome entirely for a clean card.

Then the whole studio opens up

Drop it on a gradient or mesh background, add a soft shadow, round the corners, blur a secret line, then export a pixel-perfect PNG.

A code card is just an image here.

Background, shadow, frame and export all work on it exactly like a screenshot, because under the hood it is one.

query.sql

1select id, email, count(*) as orders
2from customers
3join purchases using (id)
4where created_at > '2026-01-01'
5group by id, email
6order by orders desc
7limit 10;

Make a code screenshot →