# Helsinki Design System (HDS) — Design Style Reference

> **Unofficial, community-authored reference.** Compiled by [designsystems.one](https://www.designsystems.one). Not affiliated with, endorsed by, or sponsored by City of Helsinki. "Helsinki Design System (HDS)" and related marks belong to their respective owners. This document describes publicly observable style attributes in original words — it contains no copied documentation, logos, icon artwork, or original token files. Always defer to the official source for canonical, current values.

**System:** Helsinki Design System (HDS)
**Owner:** City of Helsinki
**Official documentation:** https://hds.hel.fi/


---

## Summary

Open-source design system for the City of Helsinki's digital services.

## Engineering profile

- **Ships for:** Web Components, React
- **Token pipeline:** Custom
- **Source model:** Open source

## Apply this style with an AI tool

Paste this into your AI coding assistant as a direction, then iterate:

> Design in the spirit of Helsinki Design System (HDS) by City of Helsinki — Open-source design system for the City of Helsinki's digital services. Match the intent, not the pixels; adapt it to my product rather than cloning it.

## Official reference

- [Helsinki Design System (HDS) documentation](https://hds.hel.fi/)

---

_Generated by [designsystems.one](https://www.designsystems.one/design-systems/helsinki-hds) — a catalogue of public design systems. Style facts are reported for reference and education; adapt them to your own product. Report issues or takedown requests via the site._