Code Screenshot Generator
Paste code, style it, and export as a PNG image.
Preview
function greet(name: string): string {
return `Hello, ${name}!`;
}
console.log(greet("World"));About This Tool
How to Use
- Paste your code into the editor
- Select the programming language for syntax highlighting
- Choose a theme (One Dark, Dracula, One Light, VS)
- Adjust padding, background color, and corner rounding
- Click Download PNG to export the styled snippet as an image
Common Use Cases
- Sharing code snippets on Twitter, LinkedIn, or blog posts
- Creating attractive code examples for documentation or presentations
- Adding styled code blocks to design mockups
- Teaching programming concepts with visually appealing examples
Tips & Tricks
- Dark themes like One Dark and Dracula tend to look best on social media
- Increase padding for a more spacious, professional look
- Use a transparent or matching background when embedding in slides
Related Tools
Prettier Code Formatter & Colorizer
Reformat and colorize your code using Prettier and react-syntax-highlighter. Easily convert messy code into a clean, readable format with syntax highlighting.
Text Diff Checker
Compare two blocks of text side-by-side and instantly see additions, deletions, and changes highlighted. Perfect for comparing code, documents, or configuration files.
JSON Formatter & Validator
Paste JSON to pretty-print, validate, minify, and explore. Click any node in the tree view to copy its JSONPath expression — perfect for building API queries.
URL Parser
Break down any URL into its components — protocol, host, port, path, query parameters, and fragment. Understand complex URLs at a glance.