shiki
A beautiful yet powerful syntax highlighter
A TypeScript library that adds accurate, editor-quality syntax highlighting to code samples on websites and in documentation, using the same grammar files as Visual Studio Code to produce colors that match what developers see in their editor.
Shiki is a TypeScript library for syntax highlighting, used to color code samples in documentation sites, blog posts, and web applications. Syntax highlighting assigns different colors to different parts of code based on their role in the language: keywords, strings, comments, and variables each get a distinct color, making code easier to scan and read.
The library uses TextMate grammars as its coloring engine. TextMate grammars are the same definition files used by editors like Visual Studio Code, so the output Shiki produces closely matches what a developer sees in a typical code editor.
The README for this repository is brief and does not describe which languages are supported, how to install the library, or what configuration options exist. The main branch is currently version 4.x. Earlier versions (v0, v1, v2, and v3) are maintained on separate branches for projects that depend on them. Full documentation lives at an external site rather than in this repository. The project is licensed under MIT.
Because the README is sparse, this explanation is limited to what it states. Guides, integration examples, and the full list of supported themes are available in the project documentation at shiki.style.
Where it fits
- Add VS Code-accurate syntax-highlighted code blocks to a documentation site or blog so code examples look polished and readable.
- Pre-render highlighted code at build time for a static site, so no client-side highlighting JavaScript is shipped to users.
- Embed colored code samples in a web app or email newsletter with language-accurate highlighting across many programming languages.