Hugo Clarity
A technology-minded theme for Hugo based on VMware's open-source Clarity Design System featuring rich code support, dark/light mode, mobile support, and much more.
Live Demo
Sbirla
![](https://www.sbirla.org/images/thumbnail.png)
Preview on Desktop
Light ModeDark Mode
![Clarity Hugo Theme desktop light](https://github.com/chipzoller/hugo-clarity/raw/master/images/screenshot.png)
![Clarity Hugo Theme desktop dark](https://github.com/chipzoller/hugo-clarity/raw/master/images/screenshot-darkmode.png)
Preview on Mobile
Light ModeDark Mode
![Clarity Hugo Theme mobile light](https://github.com/chipzoller/hugo-clarity/raw/master/images/screenshot-mobile.png)
![Clarity Hugo Theme mobile dark](https://github.com/chipzoller/hugo-clarity/raw/master/images/screenshot-mobile-darkmode.png)
Features
- Blog with tagging and category options
- Deeplinks
- Native Image Lazy Loading
- Customizable (see config)
- Dark Mode (with UI controls for user preference setting)
- Toggleable table of contents
- Flexible image configuration
- Logo alignment
- Mobile support with configurable menu alignment
- Syntax Highlighting
Rich code block functions including:
- Copy to clipboard
- Toggle line wrap (dynamic)
- Toggle line numbers
- Language label
- Toggle block expansion/contraction (dynamic)
To put it all in context, here is a preview showing all functionality.
![code block functions](https://github.com/chipzoller/hugo-clarity/raw/master/images/syntax-block.gif)
Github
chipzoller/hugo-clarity
A theme for Hugo based on VMware Clarity. Contribute to chipzoller/hugo-clarity development by creating an account on GitHub.