Introducing Mud, my theme for Hugo (the static site generator used to create this site). That’s what it’s called for the moment, at least. Because it’s brown and not very clever. Let’s see whether it sticks.
Mud uses HTML5 semantic elements for article, section, header, footer and so on, as you’d expect from a Hugo site. It also includes shortcodes for asides and footnotes in your content, allowing you to use Markdown syntax inside them - without them, you have to write all block elements in plain HTML.
Hugo shortcodes are templated expansions for Markdown. Hugo includes the
highlight shortcode, and Mud includes shortcodes for
// Here are some of the colours from the scss stylesheet: $color_background: hsl(190, 5%, 16%); $color_background_under: hsl(73, 10%, 11%); $color_background_over: hsl(43, 5%, 23%); $color_text: hsl(43, 20%, 90%); $color_text_dim1: hsl(43, 25%, 85%); $color_text_dim2: hsl(43, 21%, 79%); $color_text_dim3: hsl(43, 17%, 71%); $color_text_bright: #fff;
// Or, because Pygments supports all the cool languages, Hello World in Rust: io::println("Hello world!");
To get the code highlighting to work, you need Python (version 2 or 3). If you have a Mac, it’s already there by default. Then it’s a quick one-liner to install Pygments:
$ pip install pygments
Then, in your Hugo site’s config, set it to use CSS classes. In YAML:
# YAML: pygmentsUseClasses: true # TOML: pygmentsUseClasses = true
Hugo calls Pygments automatically during page creation, so once it’s installed you don’t have to think about it ever again.
Minimal doesn’t always mean white. White’s all very well, but we geeks and night owls appreciate the gloom of a nice dark theme. Nothing’s quite black, all the dirty greys and muted pastels are chromatically based on a small, harmonious set of hues.