pretag syntax-highlighted with a light theme, in order to differentiate between the two in a clear manner.
Screenshots can work well when done right, even when displaying text; like code-snippets. Adept them, have arrows with additional explaining text next to it. Craft them well and you can get something like this which gets it’s point across in a hands-on manner, considering this complicated matter.
Combining a colorscheme’s dark– and light version
But even when working with screenshots of code-snippets, one can mix it up with plain text in
This is not difficult to achieve with Prism syntax-hightlighter combined with Sass-variables for colors.
This article was also published on Github