Code Block Generator

A code snippet in a window-style frame with a background behind it, in the style of a code screenshot. It's live text on your page and not an image, so visitors can select and copy the code.

What you can change

• The code, the language, and one of four themes: Dark, Light, Oceanic or Monokai.

• The background, which can be a gradient preset, a solid color, your own image, or nothing.

• The window dots, file name and line numbers, each of which can be turned off.

• Padding, corner radius, shadow, and fonts for the title and the code.

Where it fits

Docs, blog posts, changelogs and developer landing pages.

Good to know

• Despite the name, it doesn't export images. There's also no copy button.

• You pick the language by hand from the 23 in the menu. Each one has its own highlighting rules, written as patterns, so unusual syntax may stay uncolored.