risotto: a Hugo theme that looks like a carefully riced terminal

No JavaScript is the first thing the feature list gives up

risotto is a minimalist, responsive Hugo theme inspired by terminal ricing aesthetics, and the first feature is plain, semantic HTML with no JavaScript. That is a design constraint rather than a missing feature, and it shapes everything else. There is no client-side router, no progressive enhancement layer and no hydration cost, which means the theme delivers its output as HTML and CSS and stops there. The second feature is equally declarative: plain CSS, no frameworks, no preprocessors, just simple and easy-to-customise stylesheets. The theme's primary language is listed as CSS, which is unusual for a Hugo theme and is the honest signal of where the work went. The third feature is that it uses CSS Grid for native responsive behaviour without arbitrary breakpoints. The practical consequence is that a layout built with grid tracks reflows as the viewport changes, rather than snapping between two or three fixed states, so the theme does not carry the usual collection of mobile, tablet and desktop overrides. The theme does not attempt to be a framework. It is a reading surface with a specific look.

Twenty base16 palettes, one parameter to switch them

The colour system is the most substantial feature and the one that gives the theme its identity. risotto uses the base16 framework to define colour schemes that can be applied with the theme.palette parameter, and twenty palettes are bundled, thirteen dark and seven light. They are named after terminal themes people already know: apprentice, base16-dark, base16-light, the four Catppuccin variants frappe, latte, macchiato and mocha, dracula, the two gruvbox variants, the two papercolor variants, the two solarized variants, tender, the two tokyo-night variants, and windows-95 plus windows-95-light. The default is base16-dark. The theme's own site at risotto.joeroe.io is validated against the W3C validation service and the README carries that badge, along with a Hugo build status badge for the example site. The reason base16 matters more than a simple colour variable is that the scheme is defined in terms of a fixed set of semantic roles rather than arbitrary colours, so a palette swap restyles the whole site coherently, and a designer can bring their own base16 file rather than fighting the theme's defaults.

Installing the theme, and the git trap in the instructions

The recommended install is to download the latest release and extract it into the project's themes/ directory, and the alternative is to clone the repository into the themes directory and check out the newest tag.

git clone https://github.com/joeroe/risotto themes/risotto && cd themes/risotto
git checkout $(git tag -l | grep '^v[0-9.]*$' | sort -V | tail -n 1)

That second line is a small piece of shell worth understanding rather than pasting blind, because it is what pins the theme to a release rather than to whatever the branch head happens to be. The tag list is filtered to tags that look like versions, sorted in version order rather than alphabetically, and the last one is taken. The README then notes the important limitation, that this approach will not work if your own site is itself a git repository, and that in that case you can add the theme as a git submodule, though it does not recommend that route because of the difficulty of tracking a specific release. Updating is the mirror image, a git pull in the themes directory if you cloned it, or re-extracting the downloaded release otherwise, replacing the old version.

cd themes/risotto
git pull

The theme is published on the Hugo Themes directory as well, and the site at risotto.joeroe.io is the live demo.

Configuration lives in your hugo.toml, not in the theme

Enabling the theme is a one-line change to your site configuration, either theme = 'risotto' in hugo.toml or theme: risotto in hugo.yaml. Everything the theme needs beyond that is documented in the exampleSite/config.toml, and the README directs you there for the theme-specific parameters to add to your own configuration. That is the correct pattern for a Hugo theme, since a theme that expects you to edit files inside its own directory makes updates painful, and this one keeps its options in your site configuration. The palette is selected with the theme.palette parameter, and for a palette that is not bundled the README gives two routes. The first is to take a CSS file from the base16-styles repository's css-variables directory and place it in your static/css/palettes directory, which is a simple drop-in for any base16 style that exists elsewhere. The second, for a wholly custom theme, is cut off in the README text available here, so the exact procedure for a hand-built scheme is not something to read off this page and would need the full documentation. The repository root holds the standard Hugo theme structure, with layouts/, static/, assets/, archetypes/, an exampleSite/ directory, a theme.toml, a config.toml, a NEWS.md and an images/ directory.

A palette is also a font choice, and that is a constraint

The theme is inspired by terminal ricing aesthetics, which is a reference to the practice of customising a terminal emulator's colours, fonts and layout, and that reference reaches further than the palette table suggests. A terminal theme is not only a set of sixteen colours, it is a specific typographic and spacing idea, with a monospaced face, tight line height and a particular density of information on screen. risotto takes the colour half of that tradition literally, with twenty schemes and a semantic role model, and the rest of it in the general shape of the page. The consequence for a user is that a palette is really a whole identity change rather than a subtle accent tweak, and the difference between a dark scheme built for long reading sessions and one built for high contrast on a bright screen is visible in how the page feels rather than in a single swatch. It also means a site built on this theme inherits one strong aesthetic, and a publication that needs to look editorial or corporate rather than technical will be fighting the default. The theme does not pretend to be neutral, and that is a fair trade for a theme whose whole identity is coherent.

Where risotto is the wrong choice

The limits follow directly from the constraints the theme advertises. If you need any client-side behaviour, there is none, so interactive elements such as a live search, a dark mode toggle that follows the system, a comment widget or a copy button on code blocks have to come from elsewhere, and adding them means introducing JavaScript into a theme that ships none. If you need a component library or a wide set of page types, such as a documentation site with a sidebar tree, tabs or admonitions, a documentation theme serves that better and risotto will not have those templates. On maintenance, the version badge in the README still reads semver v0.4.0 while the release list shows v0.5.1 from 2026-04-03, v0.5.0 from 2026-01-22 and v0.4.0 from 2024-02-12, so the badge lags the tags, and the gap between v0.4.0 and v0.5.0 spans almost two years. The last push to the repository was on 2026-08-12 and the repository is not archived, so the work continues, but the version numbering does not track the release cadence closely, and pinning to a specific tag is the practice the install instructions already set you up for. The project is MIT licensed, which is the permissive licence you want for a theme you may modify and redistribute.

Editorial conclusion

Adopt risotto if you publish a text-focused Hugo site and want a fast, dependency-free theme with a terminal inspired look and a colour scheme you can switch in one setting. Skip it if your content needs client-side interactivity, a component library, or typography and layout defaults that already exist in a more complete theme. Verify first which Hugo version your site uses, that the palette you want is one of the twenty bundled or a base16 file you place in static/css/palettes, and that the base16-dark default is not the only one your brand will tolerate.

Frequently asked questions

Official sources

1. joeroe/risotto on GitHub
2. License: MIT
3. Project website
4. README
5. Releases