Share code as an image people can read
Code pasted into a post on X or LinkedIn loses its formatting, and a screenshot of your editor shows everything around it. Pika's code screenshot generator puts just your snippet in a clean window, with syntax highlighting, a title and a background.
Type or paste your code, pick its language and choose a light or dark editor theme. There's no account and no watermark, and you can save the image as a PNG or JPG or copy it to your clipboard.
Supported languages
Syntax highlighting covers 23 languages: C-like languages, Clojure, CoffeeScript, CSS, Dart, Elixir, Elm, Go, HTML, Java, JavaScript and TypeScript, JSX, Markdown, Perl, PHP, Python, Ruby, Sass, Shell, Slim, SQL, Swift and YAML.
Tips for readable code images
- Keep the snippet short. Ten to twenty lines that show one idea read far better in a feed than a whole file.
- Make the text bigger for social posts. The font size goes from 14 to 24, and you can change the editor width to fit the canvas.
- Use the window title for the file name, like
app/page.tsx, or type a single space to hide it. - Pick a background that contrasts with the editor theme: a bright gradient behind the dark theme, or a deeper color behind the light one.
- Pro adds more fonts (JetBrains Mono, IBM Plex Mono, Source Code Pro and Space Mono) and export at up to 4K.
Make code images from VS Code
With the Pika VS Code extension, select code in your editor and run "Make screenshot in Pika" from the Command Palette. This page opens with your code and its language already set.
