Skip to content

compose-highlight

Jetpack Compose syntax highlighting powered by Highlight.js.

Renders beautifully colored, selectable, copyable code blocks in any Compose UI - with light/dark theme support, line numbers, and full customization of the header slots.

Maven Central License

Quick install

Add the dependency to your module's build.gradle.kts:

dependencies {
    implementation("dev.hossain:compose-highlight:<version>")
}

Replace <version> with the latest release.

Minimal example

HighlightThemeProvider {
    SyntaxHighlightedCode(
        code     = "val greeting = \"Hello, World!\"",
        language = "kotlin",
    )
}

That's it. HighlightThemeProvider automatically picks Tomorrow (light) or Tomorrow Night (dark) based on the system setting.

Key features

  • Wide language coverage - use any language supported by the bundled Highlight.js build
  • Light + dark themes - automatic system-mode switching, or manual override
  • Built-in themes - Tomorrow, Tomorrow Night, Atom One Dark, Atom One Light
  • Custom themes - load any Highlight.js CSS from assets/, raw CSS string, or a Map<String, SpanStyle>
  • Slots - replace the language badge and copy button with any composable
  • Line numbers - optional gutter with configurable width and color
  • Copy to clipboard - built-in, with an onCopyClick callback for custom feedback
  • Performance - one hidden WebView shared across all code blocks via HighlightThemeProvider

Next steps