govukhugo is a Hugo static-site theme from the UK Cabinet Office's co-analysis team that turns Markdown content into GOV.UK Design System compliant pages, aimed at dashboards and official statistics sites.
What is govukhugo?
govukhugo is a theme for the Hugo static site builder that renders Markdown content through Goldmark and outputs a static site styled with the GOV.UK Design System. The theme provides the GOV.UK header, footer, sidebar menu and phase-banner components, and was created to help Cabinet Office Analysts build simple public-facing sites for official statistics and open-source works. It is maintained in the co-analysis GitHub repository and was renamed from govuk-hugo to govukhugo in a breaking change.
Key Features
- GOV.UK Frontend v3.10.2 — the theme is pinned to this specific release of the GOV.UK Frontend library for its component styling.
- Dashboard-first layout — uses a wider maximum page width than standard GOV.UK pages; text elements are capped for readability at 810px for p and pre tags and 700px for li tags, while tables, images and interactives can use the full width.
- SASS-free colour palette —
dashboard-layout.css exposes the GOV.UK colour palettes as :root CSS variables, so no SASS compilation step is required.
- Syntax highlighting — code blocks are supported and highlighted with Highlight.js.
- Section-based sidebar menu — navigation is generated from content sections under the content folder; the homepage is excluded from the menu and an optional about.md file appears as a link at the bottom.
- Configurable GOV.UK branding — config.yaml params control whether the GOV.UK crown, New Transport font and favicon are used, the capitalised logotext in the header, the product name, and an alpha or beta phase banner with a feedback URL.
- GitHub Pages deployment support — the README configuration sets publishDir: docs and canonifyurls: true for GitHub Pages hosting.
- JavaScript-dependent output — because Goldmark does not add Design System classes to rendered HTML, footer JavaScript applies the GOV.UK CSS to relevant tags; the theme is therefore not suitable for environments without JavaScript.
Who is it for?
govukhugo suits anyone who needs GOV.UK-designed public pages built from Hugo and Markdown, particularly data publishers in UK government.
- UK government analysts and statisticians — publish official statistics releases as public-facing GOV.UK-styled sites without a custom build.
- Data teams building dashboards — create data-visualisation pages in the style of Public Health England's Coronavirus data dashboard, which inspired the theme.
- Hugo users deploying to service.gov.uk — set logotext: GOV.UK and the govuk flag to true to use the crown, New Transport font and GOV.UK favicon.
- Teams running alpha or beta services — add a phase banner and feedback URL to signal service maturity.
What can you do with govukhugo?
The feature set maps to four concrete publishing tasks.
- Publish official statistics — write releases in Markdown, organise them in sections, and generate a static GOV.UK-style site.
- Build interactive data dashboards — exploit the wider dashboard layout and GOV.UK colour variables for charts, tables and visualisations.
- Host project documentation on GitHub Pages — use the documented publishDir and canonifyurls settings for free static hosting.
- Present open-source work — create a public-facing site for open-source outputs with the GOV.UK header and sidebar structure.
How does govukhugo work?
Install Hugo, then either download the repo as a zip and extract it to themes/govukhugo or add it as a git submodule with git submodule add https://github.com/co-analysis/govukhugo.git themes/govukhugo. The config.yaml example sets the theme, language, publish directory, markup renderer and theme params, and content is organised in sub-folders (sections) under the content folder.
FAQ
Is govukhugo free?
govukhugo is an open-source Hugo theme hosted in the co-analysis GitHub repository. No price or licence fee is mentioned in the README.
Does govukhugo work without JavaScript?
No. Goldmark renders Markdown to HTML without GOV.UK Design System classes, so footer JavaScript applies the Design System CSS to relevant HTML tags. Environments that block JavaScript will not render the page correctly.
What version of GOV.UK Frontend does it use?
The theme uses GOV.UK Frontend v3.10.2, pinned as a specific release.
Can I deploy govukhugo to GitHub Pages?
Yes. The README configuration sets publishDir: docs and canonifyurls: true, which the theme documents for GitHub Pages deployment.
How do I show the GOV.UK crown and New Transport font?
Set the govuk param to false unless you are deploying to a .gov.uk subdomain; for service.gov.uk deployments set logotext: GOV.UK as well.
