Virtual syntax highlighting for virtual DOMs and non-HTML things, with language auto-detection. Perfect for React, VDOM, and others.

Lowlight is built to work with all syntaxes supported by highlight.js. There are three builds of lowlight:

• lib/core.js — 0 languages
• lib/common.js (default) — 35 languages
• lib/all.js — 191 languages

Want to use Prism instead? Try refractor!

• Install
• Use
• API
  • lowlight.highlight(language, value[, options])
  • lowlight.highlightAuto(value[, options])
  • lowlight.registerLanguage(language, syntax)
  • lowlight.registerAlias(language, alias)
  • lowlight.listLanguages()
• Syntaxes
• Related
• Projects
• License

This package is ESM only: Node 12+ is needed to use it and it must be imported instead of required.

npm:

npm install lowlight

Highlight:

import {lowlight} from 'lowlight'

const tree = lowlight.highlight('js', '"use strict";')

console.dir(tree, {depth: null})

Yields:

{
  type: 'root',
  data: {language: 'js', relevance: 10},
  children: [
    {
      type: 'element',
      tagName: 'span',
      properties: {className: ['hljs-meta']},
      children: [{type: 'text', value: '"use strict"'}]
    },
    {type: 'text', value: ';'}
  ]
}

hast trees can be serialized with hast-util-to-html:

import {lowlight} from 'lowlight'
import {toHtml} from 'hast-util-to-html'

const tree = lowlight.highlight('js', '"use strict";')

console.log(toHtml(tree))

Yields:

<span class="hljs-meta">"use strict"</span>;

hast trees can be turned into other things, like virtual DOMs, with hast-to-hyperscript.

hast trees are also used throughout the rehype (unified) ecosystem:

import {unified} from 'unified'
import rehypeStringify from 'rehype-stringify'
import {lowlight} from 'lowlight'

const tree = lowlight.highlight('js', '"use strict";')

const processor = unified().use(rehypeStringify)
const html = processor.stringify(tree).toString()

console.log(html)

Yields:

<span class="hljs-meta">"use strict"</span>;

This package exports the following identifiers: lowlight. There is no default export.

Parse value (string) according to the language grammar.

• prefix (string?, default: 'hljs-') — Class prefix

A hast Root with two data fields:

• relevance (number) — How sure low is that the given code is in the language
• language (string) — The detected language name

import {lowlight} from 'lowlight'

console.log(lowlight.highlight('css', 'em { color: red }'))

Yields:

{type: 'root', data: {language: 'css', relevance: 3}, children: [Array]}

Parse value by guessing its grammar.

The options of lowlight.highlight are supported, plus:

• subset (Array.<string>? default: all registered languages) — List of allowed languages

The same result as lowlight.highlight is returned.

import {lowlight} from 'lowlight'

console.log(lowlight.highlightAuto('"hello, " + name + "!"'))

Yields:

{type: 'root', data: {language: 'applescript', relevance: 3}, children: [Array]}

Register a syntax as language (string). Useful in the browser or with custom grammars.

import {lowlight} from 'lowlight/lib/core.js'
import xml from 'highlight.js/lib/languages/xml.js'

lowlight.registerLanguage('xml', xml)

console.log(lowlight.highlight('html', '<em>Emphasis</em>'))

Yields:

{type: 'root', data: {language: 'html', relevance: 2}, children: [Array]}

Register a new alias for language.

• registerAlias(language, alias|list)
• registerAlias(aliases)

• language (string) — Name of a registered language
• alias (string) — New alias for the registered language
• list (Array.<alias>) — List of aliases
• aliases (Object.<language, alias|list>) — Map where each key is a language and each value an alias or a list

import {lowlight} from 'lowlight/lib/core.js'
import md from 'highlight.js/lib/languages/markdown.js'

lowlight.registerLanguage('markdown', md)

// lowlight.highlight('mdown', '<em>Emphasis</em>')
// ^ would throw: Error: Unknown language: `mdown` is not registered

lowlight.registerAlias({markdown: ['mdown', 'mkdn', 'mdwn', 'ron']})
lowlight.highlight('mdown', '<em>Emphasis</em>')
// ^ Works!

List all registered languages.

Array.<string>.

import {lowlight} from 'lowlight/lib/core.js'
import md from 'highlight.js/lib/languages/markdown.js'

console.log(lowlight.listLanguages()) // => []

lowlight.registerLanguage('markdown', md)

console.log(lowlight.listLanguages()) // => ['markdown']

If you’re using lowlight/lib/core.js, no syntaxes are included. Checked syntaxes are included if you import lowlight (or lowlight/lib/common.js). Unchecked syntaxes are available through lowlight/lib/all.js

Note that highlight.js works as a singleton. That means that if you register a syntax anywhere in your project, it’ll become available everywhere!

• 1c — 1C:Enterprise
• abnf — Augmented Backus-Naur Form
• accesslog — Apache Access Log
• actionscript (as) — ActionScript
• ada — Ada
• angelscript (asc) — AngelScript
• apache (apacheconf) — Apache config
• applescript (osascript) — AppleScript
• arcade — ArcGIS Arcade
• arduino (ino) — Arduino
• armasm (arm) — ARM Assembly
• asciidoc (adoc) — AsciiDoc
• aspectj — AspectJ
• autohotkey (ahk) — AutoHotkey
• autoit — AutoIt
• avrasm — AVR Assembly
• awk — Awk
• axapta (x++) — X++
• bash (sh) — Bash
• basic — BASIC
• bnf — Backus–Naur Form
• brainfuck (bf) — Brainfuck
• c (h) — C
• cal — C/AL
• capnproto (capnp) — Cap’n Proto
• ceylon — Ceylon
• clean (icl, dcl) — Clean
• clojure (clj, edn) — Clojure
• clojure-repl — Clojure REPL
• cmake (cmake.in) — CMake
• coffeescript (coffee, cson, iced) — CoffeeScript
• coq — Coq
• cos (cls) — Caché Object Script
• cpp (cc, c++, h++, hpp, hh, hxx, cxx) — C++
• crmsh (crm, pcmk) — crmsh
• crystal (cr) — Crystal
• csharp (cs, c#) — C#
• csp — CSP
• css — CSS
• d — D
• dart — Dart
• delphi (dpr, dfm, pas, pascal) — Delphi
• diff (patch) — Diff
• django (jinja) — Django
• dns (bind, zone) — DNS Zone
• dockerfile (docker) — Dockerfile
• dos (bat, cmd) — Batch file (DOS)
• dsconfig — undefined
• dts — Device Tree
• dust (dst) — Dust
• ebnf — Extended Backus-Naur Form
• elixir (ex, exs) — Elixir
• elm — Elm
• erb — ERB
• erlang (erl) — Erlang
• erlang-repl — Erlang REPL
• excel (xlsx, xls) — Excel formulae
• fix — FIX
• flix — Flix
• fortran (f90, f95) — Fortran
• fsharp (fs) — F#
• gams (gms) — GAMS
• gauss (gss) — GAUSS
• gcode (nc) — G-code (ISO 6983)
• gherkin (feature) — Gherkin
• glsl — GLSL
• gml — GML
• go (golang) — Go
• golo — Golo
• gradle — Gradle
• groovy — Groovy
• haml — HAML
• handlebars (hbs, html.hbs, html.handlebars, htmlbars) — Handlebars
• haskell (hs) — Haskell
• haxe (hx) — Haxe
• hsp — HSP
• http (https) — HTTP
• hy (hylang) — Hy
• inform7 (i7) — Inform 7
• ini (toml) — TOML, also INI
• irpf90 — IRPF90
• isbl — ISBL
• java (jsp) — Java
• javascript (js, jsx, mjs, cjs) — Javascript
• jboss-cli (wildfly-cli) — JBoss CLI
• json — JSON
• julia — Julia
• julia-repl — Julia REPL
• kotlin (kt, kts) — Kotlin
• lasso (ls, lassoscript) — Lasso
• latex (tex) — LaTeX
• ldif — LDIF
• leaf — Leaf
• less — Less
• lisp — Lisp
• livecodeserver — LiveCode
• livescript (ls) — LiveScript
• llvm — LLVM IR
• lsl — LSL (Linden Scripting Language)
• lua — Lua
• makefile (mk, mak, make) — Makefile
• markdown (md, mkdown, mkd) — Markdown
• mathematica (mma, wl) — Mathematica
• matlab — Matlab
• maxima — Maxima
• mel — MEL
• mercury (m, moo) — Mercury
• mipsasm (mips) — MIPS Assembly
• mizar — Mizar
• mojolicious — Mojolicious
• monkey — Monkey
• moonscript (moon) — MoonScript
• n1ql — N1QL
• nestedtext (nt) — Nested Text
• nginx (nginxconf) — Nginx config
• nim — Nim
• nix (nixos) — Nix
• node-repl — Node REPL
• nsis — NSIS
• objectivec (mm, objc, obj-c, obj-c++, objective-c++) — Objective-C
• ocaml (ml) — OCaml
• openscad (scad) — OpenSCAD
• oxygene — Oxygene
• parser3 — Parser3
• perl (pl, pm) — Perl
• pf (pf.conf) — Packet Filter config
• pgsql (postgres, postgresql) — PostgreSQL
• php — undefined
• php-template — PHP template
• plaintext (text, txt) — Plain text
• pony — Pony
• powershell (pwsh, ps, ps1) — PowerShell
• processing (pde) — Processing
• profile — Python profiler
• prolog — Prolog
• properties — .properties
• protobuf — Protocol Buffers
• puppet (pp) — Puppet
• purebasic (pb, pbi) — PureBASIC
• python (py, gyp, ipython) — Python
• python-repl (pycon) — undefined
• q (k, kdb) — Q
• qml (qt) — QML
• r — R
• reasonml (re) — ReasonML
• rib — RenderMan RIB
• roboconf (graph, instances) — Roboconf
• routeros (mikrotik) — Microtik RouterOS script
• rsl — RenderMan RSL
• ruby (rb, gemspec, podspec, thor, irb) — Ruby
• ruleslanguage — Oracle Rules Language
• rust (rs) — Rust
• sas — SAS
• scala — Scala
• scheme — Scheme
• scilab (sci) — Scilab
• scss — SCSS
• shell (console, shellsession) — Shell Session
• smali — Smali
• smalltalk (st) — Smalltalk
• sml (ml) — SML (Standard ML)
• sqf — SQF
• sql — SQL
• stan (stanfuncs) — Stan
• stata (do, ado) — Stata
• step21 (p21, step, stp) — STEP Part 21
• stylus (styl) — Stylus
• subunit — SubUnit
• swift — Swift
• taggerscript — Tagger Script
• tap — Test Anything Protocol
• tcl (tk) — Tcl
• thrift — Thrift
• tp — TP
• twig (craftcms) — Twig
• typescript (ts, tsx) — TypeScript
• vala — Vala
• vbnet (vb) — Visual Basic .NET
• vbscript (vbs) — VBScript
• vbscript-html — VBScript in HTML
• verilog (v, sv, svh) — Verilog
• vhdl — VHDL
• vim — Vim Script
• wasm — WebAssembly
• wren — Wren
• x86asm — Intel x86 Assembly
• xl (tao) — XL
• xml (html, xhtml, rss, atom, xjb, xsd, xsl, plist, wsf, svg) — HTML, XML
• xquery (xpath, xq) — XQuery
• yaml (yml) — YAML
• zephir (zep) — Zephir

• refractor — Same, but based on Prism

• emphasize — Syntax highlighting in ANSI, for the terminal
• react-lowlight — Syntax highlighter for React
• react-syntax-highlighter — React component for syntax highlighting
• rehype-highlight — Syntax highlighting in rehype
• remark-highlight.js — Syntax highlighting in remark
• jstransformer-lowlight — Syntax highlighting for JSTransformers and Pug

MIT © Titus Wormer