Please don't forget to read Usage part of each element.
Maintaining consistent and engaging digital interfaces, whether applications or experiences, demands extended guidance around color usage.
Based on the Proximus' brand palette color, we defined functional colors defining usages like states, promo, status,... on positive and negative mode.
The visual presentation of text and images of text has a contrast ratio of at least 4.5:1.
Success criterion 1.4.3 Contrast
To ensure the color contrast and accessibility, some colors are defined or declined for web interfaces.
Each theme follow the same color system. As Proximus being the default theme, all usage documentation is writing with Proximus examples and can be apply to other themes. Please refer to the Style tab to see the other themes color palette
Primary color is the brand identifier and should always be clearly visible in all communications. It dominates and serves all Proximus platforms.
Secondary colors highlight and compliment the primary color. On Proximus Design system, we defined two secondary colors making use of Primary subtle shifts in values to help organize content into distinct zones.
A tertiary color is a third level of a color palette. The colors we defined on the Proximus design system enables the brand colors to stand out.
Used as indicator of promotions. We use Proximus' red as indicator of promotions. But to ensure the color contrast and accessibility, other colors are defined for web interfaces. For the same reasons, promo colors are different for positive and negative modes.
Used as indicator of notifications, it can be used through all the segments, modes and themes.
Specific colors are defined for the states based on this functional palette colors.
Grey and black are considered as canvas. It enables our colours to stand out.
There is 5 grey possibilities, who can be used as background colors or in particular to compose assets elements.
There is 5 black possibilities, who can be used as background colors or in particular to compose assets elements.
Extra colors can further enrich our communications. They play a supporting role and can help where additional colors are required.
For Proximus theme, the usage of extra colors is defined by segment to follow brand identity. The color intensity decreases as follows along the Business Units.
Yellow and Almond are part of our secondary colors but considered as level 2 and tend to give less desirable results. Please avoid to use them or use it with parsimony.