HTML Inline Formatter

Self-contained HTML with inline styles on each token. No external CSS required.

Options

Runtime	Options
Rust	language, theme, pre_class, italic, include_highlights, rainbow_brackets, highlight_lines, header
Elixir	language, theme, pre_class, italic, include_highlights, rainbow_brackets, highlight_lines, header
JavaScript	language, theme, preClass, italic, includeHighlights, rainbowBrackets, highlightLines, header
Java	withLang(), withTheme(), withFormatter(Formatter.HTML_INLINE)
CLI	--theme, --pre-class, --italic, --include-highlights, --rainbow-brackets, --highlight-lines, --highlight-lines-class, --highlight-lines-style, --header-open, --header-close

Basic example

JavaScript

import {highlight} from '@lumis-sh/lumis'
import {htmlInline} from '@lumis-sh/lumis/formatters'
import rust from '@lumis-sh/lumis/langs/rust'
import frappe from '@lumis-sh/themes/catppuccin_frappe'

const html = await highlight('fn main() {}', htmlInline({language: rust, theme: frappe}))

Rust

use lumis::{highlight, HtmlInlineBuilder, languages::Language, themes};

let html = highlight(
    "fn main() {}",
    HtmlInlineBuilder::new()
        .language(Language::Rust)
        .theme(Some(themes::get("catppuccin_frappe").unwrap()))
        .build()
        .unwrap(),
);

Elixir

Lumis.highlight!(
  "fn main() {}",
  formatter: {:html_inline, language: "rust", theme: "catppuccin_frappe"}
)

Java

import io.roastedroot.lumis4j.core.Formatter;
import io.roastedroot.lumis4j.core.Lang;
import io.roastedroot.lumis4j.core.Lumis;
import io.roastedroot.lumis4j.core.Theme;

var lumis = Lumis.builder().build();

var highlighter = lumis.highlighter()
    .withLang(Lang.RUST)
    .withTheme(Theme.CATPPUCCIN_FRAPPE)
    .withFormatter(Formatter.HTML_INLINE)
    .build();

var html = highlighter.highlight("fn main() {}").string();

lumis.close();

CLI

lumis highlight main.rs --formatter html-inline --theme catppuccin_frappe

Add classes and metadata

JavaScript

const html = await highlight(
  'const x = 1',
  htmlInline({language: javascript, theme: frappe, preClass: 'code-block', includeHighlights: true})
)

Rust

let formatter = HtmlInlineBuilder::new()
    .language(Language::Javascript)
    .theme(Some(themes::get("catppuccin_frappe").unwrap()))
    .pre_class(Some("code-block".to_string()))
    .include_highlights(true)
    .build()
    .unwrap();

let html = highlight("const x = 1", formatter);

Elixir

Lumis.highlight!(
  "const x = 1",
  formatter: {:html_inline, language: "javascript", theme: "catppuccin_frappe", pre_class: "code-block", include_highlights: true}
)

Java

lumis4j does not currently expose preClass or includeHighlights for HTML Inline output.

CLI

lumis highlight app.js -f html-inline -t catppuccin_frappe --pre-class my-code --include-highlights

Wrap with custom HTML

JavaScript

const html = await highlight(
  'const x = 1',
  htmlInline({
    language: javascript,
    theme: frappe,
    header: {openTag: '<figure><figcaption>index.js</figcaption>', closeTag: '</figure>'},
  })
)

Rust

use lumis::formatters::html::HtmlElement;

let formatter = HtmlInlineBuilder::new()
    .language(Language::Javascript)
    .theme(Some(themes::get("catppuccin_frappe").unwrap()))
    .header(Some(HtmlElement {
        open_tag: "<figure><figcaption>index.js</figcaption>".to_string(),
        close_tag: "</figure>".to_string(),
    }))
    .build()
    .unwrap();

let html = highlight("const x = 1", formatter);

Elixir

Lumis.highlight!(
  "const x = 1",
  formatter: {:html_inline,
    language: "javascript",
    theme: "catppuccin_frappe",
    header: %{open_tag: "<figure><figcaption>index.js</figcaption>", close_tag: "</figure>"}
  }
)

Java

Custom HTML wrappers are not currently exposed by lumis4j.

CLI

lumis highlight app.js -f html-inline --header-open '<figure>' --header-close '</figure>'

The two go together; clap rejects one without the other.

Output format

HTML Inline emits the full block structure with inline styles on each token:

<pre class="lumis" style="background-color: #303446; color: #c6d0f5;">
  <code class="language-rust" translate="no" tabindex="0">
    <div class="l-line" data-line="1">
      <span style="color: #ca9ee6;">fn</span>
      <span style="color: #8caaee;">main</span>
    </div>
  </code>
</pre>

• <pre class="lumis"> is the outer wrapper and carries the block background
• <code class="language-*"> identifies the language and keeps the block focusable
• <div class="l-line" data-line="N"> wraps each line
• <span style="..."> carries the token colors and font styles inline

When to use it

• self-contained HTML
• email / CMS / markdown export
• no external stylesheet pipeline