Custom CSS themes for Hudu
Drop-in CSS skins for Hudu's documentation platform. Each theme is a single theme.css file you paste into Hudu's custom CSS field — no build step, no JS, no Hudu admin gymnastics. Preview every theme in light and dark at huduthemes.com, with one-click copy.
| Theme | Palette | Modes | Source |
|---|---|---|---|
| Flexoki | Inky, minimalist palette by Steph Ango — calibrated for legibility & perceptual balance across light/dark | Light + dark | theme.css |
| Catppuccin | Soothing pastels by the Catppuccin community — Mocha (dark) + Latte (light) | Light + dark | theme.css |
| Tokyo Night | Neon-on-dark by enkia, inspired by Tokyo at night | Dark (+ synthesized light) | theme.css |
| Gruvbox | Retro groove, warm earthy tones by morhetz | Dark (+ synthesized light) | theme.css |
| Nord | Arctic, north-bluish palette by Sven Greb | Dark (+ synthesized light) | theme.css |
| Everforest | Green-based, warm and soft on the eyes, by sainnhe | Dark (+ synthesized light) | theme.css |
| Kanagawa | Inspired by Hokusai's Great Wave, by rebelot | Dark (+ synthesized light) | theme.css |
The table above is the featured set. Browse the full catalog — 261 themes on the website or in this repo — bulk-imported from the omarchytheme.com registry and generated from omarchy palettes via
tools/omarchy-to-hudu. Each theme's README documents its palette and provenance.
[!INFO] Flexoki is designed for reading and writing on digital screens, inspired by analog inks and warm shades of paper. Learn about its design philosophy, extended palette (50–950 ramps), and mappings at stephango.com/flexoki. The full palette reference is documented in the theme's CSS header.
- Open Hudu as an admin.
- Navigate to Admin → Design (the Custom CSS field).
- Copy the theme's CSS — one click on its huduthemes.com page, or open
theme.csshere and copy the file. - Paste into the Custom CSS field and save.
- Hard-refresh (
Ctrl+Shift+R/Cmd+Shift+R) to clear cached styles.
Note
Hudu's Custom CSS field is global — the theme applies to every user on your instance, not just you.
Tip
Back up your existing custom CSS before pasting a theme over it. There's no undo.
Clear the Custom CSS field, save, hard-refresh.
Porting an omarchy theme? Use the generator — it produces the CSS, palette README, and contrast-checked ramps for you (see tools/omarchy-to-hudu/):
python3 tools/omarchy-to-hudu/port_theme.py --dark <omarchy-theme> [--light <light-variant>] --name <name>Fill in the upstream credit TODO in the generated README, then open a PR.
Hand-making a theme? Create themes/<your-theme>/{theme.css,README.md} (palette source, credits, swatch tables) using themes/flexoki/ as the reference.
Either way: see CONTRIBUTING.md for the full PR checklist — branch naming, credit requirements, how to test on a live instance, and what reviewers look for.
Important
Prefer overriding Hudu's CSS variables; DOM-targeting selectors are used sparingly and only where variables can't reach. Hudu refactors its frontend without warning — variable overrides survive, brittle selectors don't.