Code to Image
Turn code snippets into beautiful shareable images with a window chrome and syntax highlighting.
Paste any code snippet and render it as a stylized image — like Carbon or Ray.so but running entirely in your browser. Choose between dark and light themes, set a language label, and adjust font size. The canvas renders a gradient or solid background, macOS-style window chrome (red/yellow/green dots), and your code in a monospace font. Download the result as PNG for sharing on social media, documentation, or presentations.
Preview
Related Tools
Upload an image and draw rectangles, arrows, and text labels on it, then download the annotated result.
Combine multiple images into a sprite sheet and generate CSS background-position offsets.
Preview how an image scales across mobile, tablet, laptop, and desktop viewport widths.
FAQ
- What themes are available?
- This tool includes dark (dark gray / charcoal background with light text) and light (white background with dark text) themes. Both use a monospace font for accurate code rendering.
- Does this tool do real syntax highlighting?
- The current version renders code in a single text color per theme. For full syntax highlighting, consider a dedicated tool like Carbon (carbon.now.sh). This tool is optimized for simplicity and zero dependencies.
- What is the window chrome for?
- The three colored dots (red, yellow, green) mimic the macOS window title bar, giving the image a recognizable "code window" aesthetic that is popular for sharing code on social media.