Hugo by default uses chroma for syntax highlighting. You can also use your own
stylesheets for syntax highlighting. According to the docs you set
pygmentsUseClasses=true in your config and then run the following command to
generate the stylesheet.
Here is a helper script I have created to generate
syntax.css for the
different styles available in the chroma repository.
Now you can run the script by calling it from the root of your project as follows.
Point to note is that the first argument is the light theme and the second is the dark theme.
When I go through the source code of chroma I see that each style have different number of total definitions for syntax highlighting. I suggest to pick two themes from the top 10 which can cover a lot of syntax for highlighting so that you don’t end up with a css which you would have to fill up manually for colours.
I have picked
doom-one2 as my light and dark syntax themes
respectively. What have you picked? Send me an email and let me know 😁 I hope
this was useful to you.