Colors are a vital part of our products and brands and help us to create a consistent and more usable experience.

Our color system is based on a shared base palette and color palettes specific to each brand.

#Base palette

#Grays

We strive for a minimalist and clean aesthetic, so we avoid using background colors as much as possible.

#Transparencies

Black and white alpha tones are used for overlays and text.

Black transparencies

White transparencies

Body copy palette

Our body copy palette uses the black and white transparencies.

The tertiary style should only be used for disabled states, as it is not accessible according to WCAG guidelines.

#Galaxus colors

The Galaxus brand is playful and has a wide range of colors. This is represented through the use of the 6 main colors in the user interface, where certain colors are semantically connected to a function.

Examples of usage:

• Galaxus blue is used as an interaction color
• Galaxus yellow highlights active states of specific components
• Galaxus purple and red are used for Teaser Flags in the Magazine (purple as default, red for promotions)
• Galaxus brown, red, green and purple are used for availability status

#Accessible palette

For smaller elements and text, a darker version of the primary color is used to make our elements accessible according to WCAG guidelines.

#Digitec colors

Digitec uses a limited blue and red color palette. As a principle, other colors are not allowed. The only exceptions are warnings, feedback text and product availability information.

#Supporting blue tones

The primary brand colors are supported by secondary blue tones. These colors are used on detail elements through the product.

Using these tones as background colors should be avoided, as Digitec strives to have a minimalistic and clean monochrome feel.

#Additional colors

As the primary color palette for Digitec does not cover all use-cases in a user interface, we have additional colors. These are only used for special cases, such as alerts, warnings and the price tag.

#Exceptions

These colors are only used for one of the availability display states.