$ run --tool

Code Screenshot Beautifier

Turn code and HTML snippets into beautiful, customizable presentation-ready screenshots with custom backgrounds, window styles, and syntax highlighting themes.

Language

Theme

Background

Font size

Padding

Radius

Export @

Options

Window dotsLine numbers

Window title

Paste code

Preview

index.js

1	import { useState, useEffect } from 'react';
2
3	export function useFetch(url) {
4	const [data, setData] = useState(null);
5	const [loading, setLoading] = useState(true);
6	const [error, setError] = useState(null);
7
8	useEffect(() => {
9	let cancelled = false;
10	setLoading(true);
11
12	fetch(url)
13	.then(res => {
14	if (!res.ok) throw new Error(res.statusText);
15	return res.json();
16	})
17	.then(json => {
18	if (!cancelled) {
19	setData(json);
20	setLoading(false);
21	}
22	})
23	.catch(err => {
24	if (!cancelled) {
25	setError(err.message);
26	setLoading(false);
27	}
28	});
29
30	return () => { cancelled = true; };
31	}, [url]);
32
33	return { data, loading, error };
34	}

Features

✓Multiple window styles (macOS Traffic Lights Dark/Light, Windows 11, Modern Minimal, Borderless)
✓High-resolution PNG export with crisp Retina/4K rendering
✓Rich vibrant background gradients, glassmorphism mesh, solid colors, and transparent mode
✓10+ dark and light syntax highlighting themes (VS Code Dark, One Dark, Night Owl, Dracula, Cyberpunk, Nord, Clean Light)
✓Supports HTML, JavaScript, JSX/TypeScript, CSS, Python, JSON, SQL, PHP, Rust, Go, C++, Markdown, and Plain Text
✓Customizable window title bar, line numbers, padding, font size, and shadow blur
✓Direct Copy to Clipboard and raw code export
✓100% Client-side processing — your code is completely private

How to use

1Paste your code, HTML, CSS, JavaScript, or text snippet into the code input area
2Choose a programming language for syntax highlighting or let auto-highlighting format it
3Customize the visual frame: select window style (macOS / Windows / Minimal), background gradient, color theme, font size, padding, and drop shadow
4Click 'Export PNG' to save high-resolution presentation code cards or 'Copy Image' to copy to clipboard