Helsingborg Stad


Version 2.0

The style guide is intended for websites within Helsingborgs stad and others who use our platform. The guide provides examples, markup and themes for our standardized components. The Helsingborg Styleguide is a flexible and minimalistic component-based framework built in the BEM standard & designed around the Atomic Design principle.

You can easily get started by including our CSS and JavaScript from our GitHub CDN. For the advanced user who wants to customize our code, please refer to the source files in our styleguide at https://github.com/helsingborg-stad/styleguide.


A web for everyone

The component library is a collection of robust views with built-in logic to handle common scenarios.

Atomic Design

A wide variaty of components

The Atomic Design System give structure to the components by organising them in three different levels: Atoms, Molecules and Organisms.


Behind the screen

Swiftly create new apperance of anything in the styleguide, or even create a new component. Each utility has their corresponding mixin.


Behind the screen

One of the main focus of this styleguide is usability. Read more of our guidelines here.

Feb 03, 2020

Updates will be showing here

This is just a placeholder, real updates will be showing here soon.