Syntax Highlighter

Highlight code syntax in multiple languages

Browser ProcessingYour data never leaves your browser

Code

Language

Theme

Show line numbers

Wrap long lines

Preview

1	<span style="color: #ff79c6">function</span> <span style="color: #50fa7b">greet</span>(name) {
2	<span style="color: #ff79c6">const</span> message = <span style="color: #f1fa8c">`Hello, ${name}!`</span>;
3	<span style="color: #ff79c6">return</span> message;
4	}
5
6	console.<span style="color: #50fa7b">log</span>(<span style="color: #50fa7b">greet</span>(<span style="color: #f1fa8c">'World'</span>));

HTML Output

<pre style="background-color: #282a36; padding: 1em; border-radius: 0.5em; overflow-x: auto;"><code style="color: #f8f8f2; font-family: monospace;"><span style="color: #6272a4; margin-right: 1em; user-select: none;">  1</span><span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #ff79c6"<span style="color: #ff79c6">></span>function<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span> <span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #50fa7b"<span style="color: #ff79c6">></span>greet<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span>(name) {
<span style="color: #6272a4; margin-right: 1em; user-select: none;">  2</span>  <span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #ff79c6"<span style="color: #ff79c6">></span>const<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span> message <span style="color: #ff79c6">=</span> <span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #f1fa8c"<span style="color: #ff79c6">></span>`Hello, ${name}<span style="color: #ff79c6">!</span>`<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span>;
<span style="color: #6272a4; margin-right: 1em; user-select: none;">  3</span>  <span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #ff79c6"<span style="color: #ff79c6">></span>return<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span> message;
<span style="color: #6272a4; margin-right: 1em; user-select: none;">  4</span>}
<span style="color: #6272a4; margin-right: 1em; user-select: none;">  5</span>
<span style="color: #6272a4; margin-right: 1em; user-select: none;">  6</span>console.<span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #50fa7b"<span style="color: #ff79c6">></span>log<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span>(<span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #50fa7b"<span style="color: #ff79c6">></span>greet<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span>(<span style="color: #ff79c6"><</span>span style<span style="color: #ff79c6">=</span>"color<span style="color: #ff79c6">:</span> #f1fa8c"<span style="color: #ff79c6">></span>'World'<span style="color: #ff79c6"><</span><span style="color: #ff79c6">/</span>span<span style="color: #ff79c6">></span>));
</code></pre>

About Syntax Highlighter

Highlight code syntax in multiple languages

Use this free online programming tools tool to work faster without installing extra software. The interface is built for quick input, clear output, and straightforward results on desktop and mobile devices.

Processing

This tool runs in your browser whenever possible, which keeps your inputs private and reduces unnecessary round-trips to the server.

JSON ValidatorValidate JSON syntax and find errors

JSON to YAML ConverterConvert JSON to YAML format

YAML to JSON ConverterConvert YAML to JSON format

Syntax Highlighter

About Syntax Highlighter

Processing

Related Tools