The highlight colors can be changed by overriding these CSS variables:
--hljs-comment
: Used for code comments--hljs-number
: Used for number values in code--hljs-string
: Used for string values in code--hljs-literal
: Used for literal values in code--hljs-tag
: Used for HTML/XML tags--hljs-attribute
: Used for attributes in HTML/XML tags--hljs-symbol
: Used for symbols in code--hljs-bg
: Used for the background color of code blocks--hljs-builtin-name
: Used for built-in function names
For example to override the string color:
:root {
--hljs-string: pink;
}
It seems like hljs (the highlighting library used) may not support highlighting python identifiers like degirum
in your example, but you should be able to get pretty close by changing the other colors.
For the font, that’s strange–code blocks should appear with a monospace font by default. I’d suggest double-checking your theme to make sure nothing in being overridden there.