En felles digital verktøykasse

Designsystemet is a set of building blocks for making better web solutions and creating design systems.

Our goal is to create consistent and user-friendly experiences in digital solutions for public services, making them more efficient and reliable.

Links

designsystemet.no - Documentation.

Theme Builder - Create your theme and get a config file for Figma and code.

Packages

@digdir/designsystemet - CLI that creates CSS and optionally design tokens for your theme from the config file.

@digdir/designsystemet-css - CSS implementation of Designsystemet components. Used by the React package. Contains a default theme.

@digdir/designsystemet-web - Framework-agnostic implementations of some Designsystemet web components and helpers.

@digdir/designsystemet-react - React implementation of Designsystemet components.

@digdir/designsystemet-types - Types for Designsystemet.

Get started

Please refer to our setup guide for getting started in code.

Figma

Core UI Kit - The component library for Figma.

Designsystemet plugin - Import your theme into Figma.

Contributing

Learn how you can contribute to this project by reading our Code of Conduct and Contributing Guide.

AI Development

Our documentation and patterns are available as Markdown. Append .md to a page URL or request it with Accept: text/markdown. See llms.txt for a documentation index.

Contributors

We are lucky to have a great group of people who have contributed to Designsystemet.

Thanks to Chromatic for providing the visual testing platform that helps us review UI changes and catch visual regressions.