HljsSelectors

Known highlight.js CSS selector keys used throughout the library.

highlight.js wraps each syntax token in a <span class="hljs-*"> element. These class names are mapped to androidx.compose.ui.text.SpanStyle entries by ThemeParser when parsing a theme CSS file, and looked up by HtmlToAnnotatedString when converting the HTML to an androidx.compose.ui.text.AnnotatedString.

The full set of keys available depends on the theme - different CSS themes define different selectors. The constants below cover all official hljs scopes as documented in the CSS Classes Reference.

Base selector

• BASE ("hljs") - The root container rule. Provides the default text color and background for the entire code block. Used by HighlightTheme.backgroundColor and HighlightTheme.defaultTextColor to derive theme-level defaults.

General purpose selectors

These cover the most common token types. Some (OPERATOR, PUNCTUATION, PROPERTY) are newer scopes and may not be present in all themes:

• KEYWORD - Language keywords (if, for, fun, def, etc.)

• BUILT_IN - Built-in or library objects (constants, classes, functions)

• TYPE - Data types (string, int, array, etc.)

• LITERAL - Special identifiers for built-in values (true, false, null, etc.)

• NUMBER - Numbers, including units and modifiers

• OPERATOR - Operators: +, -, >>, |, == (newer scope, not in all themes)

• PUNCTUATION - Auxiliary punctuation: parentheses, brackets, etc. (newer scope)

• PROPERTY - Object properties: obj.prop1.prop2.value (newer scope)

• REGEXP - Literal regular expressions

• STRING - Literal strings and characters

• CHAR - Base character scope (primary key emitted by ThemeParser)

• CHAR_ESCAPE - Character escape literals (official scope: char.escape_)

• SUBST - Parsed sections inside literal strings. Important: the hljs theme guide explicitly says "don't forget to style .subst" - it should usually reset to the default text color.

• SYMBOL - Symbolic constants, interned strings, goto labels

• VARIABLE - General variables

• VARIABLE_LANGUAGE - Variables with special meaning (this, window, super, self)

• VARIABLE_CONSTANT - Constant-value variables (e.g. MAX_FILES)

• TITLE - Name of a class or function

• PARAMS - Function arguments/parameters at the place of declaration

• COMMENT - Comments

• DOCTAG - Documentation markup within comments (e.g. @param)

Title subscopes

highlight.js outputs space-separated classes like class="hljs-title function_" which are resolved as dot-joined keys by ThemeParser:

• TITLE_CLASS ("hljs-title.class_") - Name of a class, interface, trait, module

• TITLE_CLASS_INHERITED ("hljs-title.class_.inherited__") - Inherited/extended class name

• TITLE_FUNCTION ("hljs-title.function_") - Name of a function

• TITLE_FUNCTION_INVOKE ("hljs-title.function.invoke_") - Function being invoked

Meta selectors

• META - Flags, modifiers, annotations, preprocessor directives

• META_KEYWORD - Keywords inside a meta block (nested, hyphenated in CSS)

• META_STRING - Strings inside a meta block (nested, hyphenated in CSS)

• META_PROMPT - REPL or shell prompts

Tags, attributes, configs

• TAG - XML/HTML tags

• NAME - Name of an XML tag, first word in an s-expression

• ATTR - Attribute names without language semantics (JSON keys, .ini settings)

• ATTRIBUTE - Attribute names followed by structured values (e.g. CSS properties)

• SECTION - Section headings in config files or text markup

CSS selectors

• SELECTOR_TAG - Tag selectors

• SELECTOR_ID - #id selectors

• SELECTOR_CLASS - .class selectors

• SELECTOR_ATTR - [attr] selectors

• SELECTOR_PSEUDO - :pseudo selectors

Text markup

• BULLET - List item bullets

• CODE - Code blocks

• EMPHASIS - Emphasis (typically maps to androidx.compose.ui.text.font.FontStyle.Italic)

• STRONG - Strong emphasis (typically maps to androidx.compose.ui.text.font.FontWeight.Bold)

• FORMULA - Mathematical formulas

• LINK - Hyperlinks

• QUOTE - Quotations or blockquotes

Templates

• TEMPLATE_TAG - Tags of template languages

• TEMPLATE_VARIABLE - Variables in template languages

Diff

• ADDITION - Added or changed lines

• DELETION - Deleted lines

Other

• ATRULE - At-rule tokens (found in a small number of themes)

Usage

Use these constants when building color maps for HighlightTheme.fromColorMap to avoid typos and get IDE autocomplete with full KDoc descriptions:

val colorMap = mapOf(
    HljsSelectors.BASE     to SpanStyle(color = Color(0xFF24292E), background = Color(0xFFFFFFFF)),
    HljsSelectors.KEYWORD  to SpanStyle(color = Color(0xFFD73A49), fontWeight = FontWeight.Bold),
    HljsSelectors.STRING   to SpanStyle(color = Color(0xFF032F62)),
    HljsSelectors.COMMENT  to SpanStyle(color = Color(0xFF6A737D), fontStyle = FontStyle.Italic),
)
val theme = HighlightTheme.fromColorMap(name = "my-theme", colorMap = colorMap)

Internally, HighlightTheme and HtmlToAnnotatedString use BASE to derive the default text and background colors. All other selectors are discovered dynamically from the theme CSS at runtime.

See also