Design principles

Colors

Always use colors defined within the City of Ghent colors palette.

Color contrast

You must make sure that the contrast ratio of text and interactive elements meets level AA of the Web Content Accessibility Guidelines (WCAG 2.1).

ⓘ All components defined within the City of Ghent already take into account the necessary contrast ratio.

Typography

Font

The default text font of the City of Ghent Style Guide is Google font “Fira Sans”. For a more detailed explanation, see Fonts.

Headings

Headings create structure. They provide a quick way to scan the main sections of a website. Use them consistently and correctly. For more information, see Heading.

Layout

The City of Ghent Style Guide supports the following layouts:

Always use one of these layouts for the web pages in your website. See the documentation for each layout to learn what the layout is for.