Skip to content

Syntax Highlighter

Highlight a snippet of JavaScript, TypeScript, JSON, CSS, HTML, SQL, Python or shell, and copy it as HTML.

Input

Output

function greet(name) {
  // say hello
  return `Hello, ${name}!`;
}

A tokenizer, not a parser

Strings, comments, numbers, keywords and punctuation are recognised and coloured. It does not build a syntax tree, so it cannot tell a type name from a variable — but it also cannot fail on code it does not fully understand, which matters when you are pasting a fragment.

The output is real HTML with a class per token type, so pasting it into a page or an email keeps the colours. Every token is escaped before it is wrapped, so highlighting a snippet that contains `<script>` produces text, not a script tag.

Frequently asked questions

Which languages are supported?

JavaScript, TypeScript, JSON, CSS, HTML, SQL, Python and shell. Auto-detection guesses from the shape of the input and can be overridden.

Why is a type name not coloured differently?

That needs a parser with scope information. This works token by token, which is enough to make code readable and small enough to run instantly.

Related tools