Dimension

Dimension is a Hugo port of HTML5UP's minimal and responsive Dimension theme, built to work with headless CMSs such as Netlify CMS by keeping all page content in editable markdown files.

What is Dimension?

Dimension is a Hugo theme that recreates the single-page Dimension design originally published on HTML5UP. It takes a Hugo site configuration and content files written as _index.md and produces a responsive personal website with a main page and optional posts. The theme runs on Hugo, the static site generator, and is released under the CC BY 3.0 License. The project is authored by Davide Asnaghi, as stated in the repository copyright.

Key Features

• Native headless CMS support — the theme is designed so that all main page styling and configuration happens in _index.md files, letting any headless CMS like Netlify CMS edit content without code changes.
• Minimal configuration — you only need to set baseURL, languageCode, title, and theme in config.toml to get the theme running.
• Customizable background and logo — both fields accept local image paths from the static directory (JPG, PNG, SVG) or full URLs to online assets.
• Built-in post archetype — the theme ships with an _index.md archetype that defines title, description, background, and logo parameters for new content.
• Live-reload development — running hugo server -t dimension serves the site at localhost:1313 and automatically refreshes on changes.
• Content organization — the structure supports a root content/_index.md for the homepage and content/posts/_index.md for a posts section, each with its own background and logo.

Who is it for?

• Personal site owners — turn a name, description, and an image into a polished one-page website with minimal setup.
• Portfolio presenters — use the posts section to display projects with custom backgrounds and logos for each section.
• Developers using a headless CMS — manage the site through Netlify CMS or another markdown-based backend thanks to the _index.md content model.
• Hugo learners — study a compact theme that demonstrates archetypes, static assets, and configuration in a real project.

What can you do with Dimension?

• Launch a personal homepage: edit content/_index.md to change your name, biography, background image, and logo.
• Add a posts section: create content/posts/_index.md with its own title and images to publish articles or project notes.
• Connect external assets: reference images from the web directly in the background or logo fields, as shown in the repository with a Wikimedia Commons SVG.
• Set up Netlify CMS: because content lives in markdown files, you can point Netlify CMS at the content folder and edit the site from a browser.

How does Dimension work?

Install the theme by downloading the repository into themes/dimension, cloning it with git clone https://github.com/your-identity/hugo-theme-dimension.git themes/dimension, or adding it as a git submodule. Then copy a minimal config.toml (with baseURL, languageCode, title, and theme) to your Hugo root, create your _index.md files, and run hugo server -t dimension to preview locally.

FAQ

Is Dimension free?

Yes, Dimension is released under the CC BY 3.0 License, which allows free use and modification with attribution. No pricing or premium tier is mentioned in the repository.

Can I use my own images for the background and logo?

Yes, both the background and logo parameters in _index.md accept local image paths from the static directory or full external URLs. The theme supports JPG, PNG, and SVG formats.

Does Dimension support Netlify CMS?

The theme is designed to be CMS-friendly by placing all page configuration in _index.md files, so any headless CMS that edits markdown, including Netlify CMS, can be used to customize the site.