Your editor’s colors, on your page.Highlighted natively, with Shiki’s familiar calls.

Code is easier to read in color.

Ferriki is a highlighter built on that machinery. It reads the same grammars and themes, follows one language into the next and returns HTML that is ready for the page. Its engine is written in Rust; Node.js and Vite use the same engine through a compiled module.

<!doctype html><html lang="en">  <head>    <style>      button {        color: rebeccapurple;      }    </style>  </head>  <body>    <button data-name="Ferriki">Say hello</button>    <script type="module">      const button = document.querySelector("button");      button.addEventListener("click", () => {        const name = button.dataset.name ?? "you";        alert(`Hello, ${name}!`);      });    </script>  </body></html>

The template expression is selected to begin with. The grammar knows that name sits in a placeholder, inside a template string, inside JavaScript, inside a script element, inside HTML. That nesting is why the variable keeps its own color while the text around it is colored as a string.

Less time for every page of code.

On 78 files in 34 languages, Ferriki needed less time than Shiki with either of its engines. Prism was faster still, with simpler grammars that see less of the code.

Ferriki does the work Shiki does, with the same grammars and themes. The difference is where the matching runs: in native Rust, rather than in WebAssembly or in regular expressions translated to JavaScript. Prism takes another road. Its grammars are written for speed and recognize fewer details, so a parameter or an embedded language may stay plain; the Prism comparison shows the same examples side by side.

We ship the preparation.

Standard language packages arrive with their patterns already compiled, so a new process can start highlighting instead of preparing.

Ferriki moves it earlier. Ferroni, its regular-expression engine, compiles the static patterns and prepares their scanners when a language package is built. The package carries that work to your machine, the disk cache keeps it, and a fresh process restores it instead of rebuilding it. Patterns that depend on text captured earlier in the line still compile on the spot, as TextMate requires.

Compile before delivery

Ferroni compiles the static patterns and prepares their scanners.

Deliver the package

Each requested grammar arrives with that work inside it.

Keep it on disk

Verified downloads stay in your cache from one build to the next.

Restore, then highlight

A fresh process restores the scanners and starts on your code.

The engine reports what it did. Here is the HTML file from above, highlighted twice by fresh highlighters: once with the prepared packages, once from the grammar source.

Preparation has a price: a prepared package is a larger download than its grammar alone, and the unpacked data takes disk space. Only the languages you request are fetched, and a missing package falls back to the grammar source. Download sizes for each language

Sponsored by Sebastian Software, which currently covers Ferriki’s CDN costs.

Finished before the page ships.

Keep a code example beside the React component that explains it. While Vite builds the site, Ferriki turns the example into highlighted HTML and CSS.

import { Code } from "@ferriki/core/react/macro";

export function Answer() {
  return (
    <Code
      language="ts"
      source={`export const answer = 42;`}
    />
  );
}

export const answer = 42;

The adapter works with Vite 8. Other build tools have no adapter yet; they can call Ferriki from Node.js like any other script. Set up the Vite adapter

Style once. Switch themes freely.

Class-based output keeps the token names in the markup and the colors in a stylesheet. Another theme is another rule, not another highlighting run.

With codeToHtmlWithCss, Ferriki writes each token’s scope into its classes and returns the themes as CSS. Dark mode becomes one attribute on the page, and your own stylesheet can restyle a single kind of token, as the second switch shows.

type Greeting = { name: string };

export function greet({ name }: Greeting) {
  // Template literals keep their own colors.
  return `Hello, ${name}!`;
}

Work with class-based output

Familiar calls, native underneath.

Start with Shiki-style calls in Node.js, or use the engine directly from Rust.

Coming from Shiki, the calls will look familiar: createHighlighter, codeToHtml, the themes map, transformers and decorations. Ferriki covers that HTML API with its own native engine. It runs in Node.js and in Rust, not in the browser; by the time a page loads, its work is done.

import { createHighlighter } from "@ferriki/core";

const highlighter = await createHighlighter({
  langs: ["typescript"],
  themes: ["github-light-default"],
});
try {
  const html = highlighter.codeToHtml("const answer = 42;", {
    lang: "typescript",
    theme: "github-light-default",
  });
  console.log(html);
} finally {
  highlighter.dispose();
}

const answer = 42;

use ferriki::{
    Highlighter, RemoteAssets, RenderOptions,
    StandardAssetCatalogs, render_html,
};

fn main() -> Result<(), Box<dyn std::error::Error>> {
    let assets = StandardAssetCatalogs::remote(RemoteAssets::default())?;
    let mut highlighter = Highlighter::builder()
        .with_assets(assets)
        .load_languages(["rust"])
        .load_themes(["github-light-default"])
        .build()?;

    let tokens = highlighter.highlight(
        "fn main() { println!(\"Hello, Ferriki!\"); }",
        "rust",
        "github-light-default",
    )?;
    let html = render_html(&tokens, &RenderOptions::default());
    println!("{html}");
    Ok(())
}

Migrate from Shiki · Ferriki and syntect · API overview

The same HTML as Shiki.

On our 14 repository files, Ferriki’s HTML matched Shiki’s byte for byte.

Compatibility is checked, not claimed. Shiki’s own test suite runs unchanged against Ferriki’s engine from a pinned copy in the repository. The tokenizer is a mechanical port of vscode-textmate, the library inside VS Code, and is checked against its test cases. Tests outside Ferriki’s scope are listed with their reasons instead of being skipped quietly.

• Repository files with HTML identical to Shiki’s14 / 14

Measured 2026-10-24 with Ferriki 1.2.0 and Shiki 4.5.0, using Oniguruma in WebAssembly as Shiki’s engine. What compatibility covers

Built for the code you publish.

94 grammars and 65 themes ship as standard packages, from TypeScript and Rust to Vue, Svelte and Astro.

Component formats are where highlighters tend to struggle. A Vue or Svelte file holds markup, styles and script; an Astro file adds expressions inside the markup. TextMate grammars describe those languages inside one another, and Ferriki follows them. Grammars that only serve as building blocks, such as the expressions inside an Angular template, load with the language that needs them.

Documents and configuration, 9

Documentation, content, package metadata, application settings, and data exchange.

Web languages and components, 12

Browser and server JavaScript, React syntax, PHP, and component frameworks.

Styles and templates, 9

Stylesheets, preprocessors, Handlebars and Liquid templates, CSS-in-JS, and Lit HTML/SVG templates.

General-purpose programming, 21

Backend services, systems software, desktop and mobile apps, scripting, and scientific computing.

Infrastructure and automation, 9

Shell scripts, build files, containers, infrastructure definitions, and code changes.

Game scripting, 2

GDScript for Godot and Luau for Roblox and other Luau runtimes.

Queries and patterns, 3

Database queries, GraphQL operations and schemas, and regular expressions.

WebAssembly and graphics, 2

WebAssembly text and WGSL shaders for WebGPU.

Your own grammars and themes register as JSON, with embedded languages and injections. Every language and theme

Good company.

Ferriki works on its own. These are the places where it meets the rest of the workshop.

Each engine in the workshop has its own job and its own API, and none needs another beside it. Where two fit together, the cards below say how.

Ferroni

Ferriki runs on it

A regex engine. Runs Oniguruma's regular expressions in Rust, lookbehind, backreferences, named groups and Unicode classes included, with the multi-pattern scanner that editors and highlighters drive built in.

ferroni.dev

Ferromark

Often used with Ferriki

A Markdown renderer. Turns Markdown into HTML, sanitized by default, and is among the fastest engines for the job.

ferromark.dev

Ardo

A documentation framework for React. Builds static documentation sites from Markdown and MDX with React components, navigation and search, using Ferromark for Markdown rendering and Ferriki for syntax highlighting.

Runs on Ferriki

Shiki brought editor-grade highlighting to the web. Ferriki keeps its familiar HTML API and moves the engine to native Rust, without WebAssembly or regex translation, so Rust programs can use it directly and a Vite build can ship highlighted HTML instead of a highlighter. Ferriki checks itself against Shiki’s tests, and its tokenizer is a port of Microsoft’s vscode-textmate. It is an independent project, one of the Ferramenta engines, made by Sebastian Software in Mainz, Germany.