List of all Chroma classes? [SOLVED]

Does someone has a list of all classes that the Chroma syntax highlight can use (including the meaning of the abbreviations)? I looked through the Hugo source code but couldn’t find it.

(I need that list for my own CSS styling.)


Edit: Speaking of Chroma classes, can we remove the encapsulating highlight class? (It conflicts with my other code.)

<div class="highlight">
<pre class="chroma">
     <code class="language-html" data-lang="html">

The doc page say we can use the pygmentOptions variable, which in theory should have a cssclass value (according to the doc page).
And that setting would make it possible for me to change the class name (or perhaps even remove it), according to the pygments doc.

But when I placed the following in my TOML configuration file, it has no effect:

pygmentsOptions = "cssclass=hellothere"

This does work, so it’s not like the pygmentsOptions is not read by Hugo:

pygmentsOptions = "linenos=inline"
  • Ask this person:
  • The Chroma integration only supports a subset of the Pygments options (I deliberately reused those options to make the transition seamless). That subset is documented, but it does not include cssclass.

The class names are derived from Pygments. So you will find more info in Pygments documentation. Though, the chroma generated CSS is documented well enough.

For example, do:

hugo gen chromastyles --style=github > github_chroma.css

I believe Chroma understands only three values of that linenos parameter:

  • Not set
  • Set to table (since Hugo 0.30)
  • Set to anything else (inline)

That is correct; but I would add that Hugo translates the “linenos=inline” to Chroma options, so if you ask the Chroma author about “linenos”, he would just shake his head.

Thanks for the quick reply.

To give some feedback, perhaps the doc page can be updated with that information, since there cssclass is listed:


Because the same documentation page also says “To make the transition from Pygments to Chroma seamless, they share a common set of configuration options”, I read that as saying that Pygments configuration options are compatible with Chroma.

Perhaps a table that says which options are Chroma-specific, which ones are Pygments-specific, and which ones are shared might help a lot.

Thanks, I’m familiar with that command, but that does not generate a full list of Chroma classes (as reported here on GitHub).

I did find a token list in the Pygments docs, but not the abbreviated class names with that. But I’ll ask in the Chroma GitHub repository.

Thanks guys!

I’ve found a list of all Chroma classes in the Chroma GitHub repository here.

Below is the formatted output from that source file, in case anyone else is wondering what all the possible Chroma classes are:

Token Chroma class
Keyword .chroma .k
KeywordConstant .chroma .kc
KeywordDeclaration .chroma .kd
KeywordNamespace .chroma .kn
KeywordPseudo .chroma .kp
KeywordReserved .chroma .kr
KeywordType .chroma .kt


Token Chroma class
Name .chroma .n
NameAttribute .chroma .na
NameBuiltin .chroma .nb
NameBuiltinPseudo .chroma .bp
NameClass .chroma .nc
NameConstant .chroma .no
NameDecorator .chroma .nd
NameEntity .chroma .ni
NameException .chroma .ne
NameFunction .chroma .nf
NameFunctionMagic .chroma .fm
NameProperty .chroma .py
NameLabel .chroma .nl
NameNamespace .chroma .nn
NameOther .chroma .nx
NameTag .chroma .nt
NameVariable .chroma .nv
NameVariableClass .chroma .vc
NameVariableGlobal .chroma .vg
NameVariableInstance .chroma .vi
NameVariableMagic .chroma .vm


Token Chroma class
Literal .chroma .l
Date .chroma .ld


Token Chroma class
LiteralString .chroma .s
LiteralStringAffix .chroma .sa
LiteralStringBacktick .chroma .sb
LiteralStringChar .chroma .sc
LiteralStringDelimiter .chroma .dl
LiteralStringDoc .chroma .sd
LiteralStringDouble .chroma .s2
LiteralStringEscape .chroma .se
LiteralStringHeredoc .chroma .sh
LiteralStringInterpol .chroma .si
LiteralStringOther .chroma .sx
LiteralStringRegex .chroma .sr
LiteralStringSingle .chroma .s1
LiteralStringSymbol .chroma .ss


Token Chroma class
LiteralNumber .chroma .m
LiteralNumberBin .chroma .mb
LiteralNumberFloat .chroma .mf
LiteralNumberHex .chroma .mh
LiteralNumberInteger .chroma .mi
LiteralNumberIntegerLong .chroma .il
LiteralNumberOct .chroma .mo


Token Chroma class
Operator .chroma .o
OperatorWord .chroma .ow


Token Chroma class
Punctuation .chroma .p


Token Chroma class
Comment .chroma .c
CommentHashbang .chroma .ch
CommentMultiline .chroma .cm
CommentPreproc .chroma .cp
CommentPreprocFile .chroma .cpf
CommentSingle .chroma .c1
CommentSpecial .chroma .cs


Token Chroma class
Generic .chroma .g
GenericDeleted .chroma .gd
GenericEmph .chroma .ge
GenericError .chroma .gr
GenericHeading .chroma .gh
GenericInserted .chroma .gi
GenericOutput .chroma .go
GenericPrompt .chroma .gp
GenericStrong .chroma .gs
GenericSubheading .chroma .gu
GenericTraceback .chroma .gt

A description of these tokens can be found here.

1 Like

So, for Pygments we support ALL of those, for Chroma only a subset. The docs looks correct to me.