Frequently asked questions
Here you will find frequently asked questions about HDS and answers to those questions. If you do not find an answer to your question on this page, you can always contact the HDS team for more information.
- General
- Design
- Code
- Accessibility
General
Helsinki Design System (HDS) is an open-source design system built by the City of Helsinki. It consists of tools for development and design as well as resources and guidelines for creating user-friendly, accessible solutions for the city.
Helsinki Design System is being developed and maintained by a 5-person team. The team consists of a product owner, two developers, and two designers. It is also very common that projects using the HDS libraries will contribute to the development via proposing designs, bug fixes, and new features.
Yes! We appreciate all contributions both from inside and outside of the city organisations. Contributions can relate to design, implementation or documentation. You can find our contribution guidelines in the
Getting started - Contribution section.
We are always happy to help you and your project if you have issues with HDS. We also appreciate feedback. You can find the recommended contact channels in the
About - Support section.
HDS follows the guideline of the City of Helsinki related to browser support. This means that the following browsers are officially supported
- Chrome
- Firefox
- Safari
Versions 6 months old and newer are supported.
Note: While these three (3) browsers are officially supported by the HDS, you can still report bugs and request support related to other browsers as well. HDS team will do their best to fix issues with other browsers and versions too.
HDS components and patterns are designed to be used on mobile devices right from the start. All HDS components are fully featured both on mobile and desktop screens, meaning that features are not degraded for mobile devices.
HDS uses two (2) methods to provide components for different screen sizes. The first method is to provide responsive components that react to the changing screen size (e.g. Navigation). The second method is to provide a separate small
variant that can be used both on mobile screens as well as on more information-heavy user interfaces.