Icons
Icons help to give the brand a human touch and at the same time make content easy to grasp.
To ensure a consistent visual language, all our illustrations and icons have the same graphic language of geometrically constructed shapes.
We distinguish between semantic icons and communicational icons.
All icons should be intuitively understandable and visualize the defined content simply and clearly. They are ideally colour-agnostic and minimalistic.
All lines should fit the pixel grid as close as possible. Vector usage (SVG) is preferred.
Semantic icons
Semantic icons exist alongside UI and interaction elements and should help to describe the function of a button, for example. They need to be minimally sized while conveying as much information as possible. They need to be monochrome and are not intended to be multi-coloured.
Their smallest version (16 ✕ 16 px) is intended to be used in a button or navigation element next to text. A slightly larger, probably a bit more detailed version (32 ✕ 32 px) can stand alone, if the context is clear.
Communicational icons
Communicational icons can convey complex topics quickly and understandably and are mainly used in apps and on the web to visualize products, offers and services. They can also be used to support presentation content.
Size: 96px ✕ 96px. Should be scaleable to 64px and also up to 256px.