Code Screenshot

Name: Code Screenshot
Author: DevToolkit

Create beautiful, shareable code screenshots with syntax highlighting, 6 themes, gradient backgrounds, and window controls. Like Carbon, but in your browser — no signup needed.

Settings

Theme

Language

Font

Font Size (14px)

Padding (48px)

Background

Border Radius (12px)

Window Title

Show line numbersShow window controlsDrop shadow

Quick Gradients

Code

Preview

1function fibonacci(n) {
2  "color:#6272a4">// Calculate nth Fibonacci number
3  if (n <= 1) return n;
4  let a = 0, b = 1;
5  for (let i = 2; i <= n; i++) {
6    [a, b] = [b, a + b];
7  }
8  return b;
9}
10 
11console.log(fibonacci(10)); "color:#6272a4">// 55

devtoolkit.cc

Made with DevToolkit

6 Pro Themes

Dracula, One Dark, Monokai, Nord, GitHub Dark, and Solarized with accurate syntax colors.

Custom Gradients

8 preset gradients plus custom color picker. Adjust padding, borders, and shadows.

Export & Share

Export as PNG or SVG. Perfect for Twitter, blog posts, presentations, and documentation.

Frequently Asked Questions

What is a code screenshot tool?

A code screenshot tool (similar to Carbon.sh or Ray.so) creates beautiful, shareable images of your source code with syntax highlighting, custom themes, and styled backgrounds. Perfect for social media posts, blog articles, and presentations.

What themes are available?

We include 6 popular themes: Dracula, One Dark, Monokai, Nord, GitHub Dark, and Solarized. Each theme applies accurate syntax highlighting colors for a professional look.

What languages are supported?

Basic syntax highlighting works for JavaScript, TypeScript, Python, HTML, CSS, JSON, Bash, SQL, Go, and Rust. The highlighting covers keywords, strings, comments, numbers, and function calls.

Can I use code screenshots commercially?

Yes! The screenshots you create are yours to use however you want. They're commonly used in blog posts, documentation, Twitter/X posts, slide decks, and README files.

Share: X LinkedIn Reddit