To ensure a consistent brand experience across all digital touchpoints, this guideline provides an overview on core design elements, essential digital components as well as inspiring best practices. It serves as first go to ressource for designers, developers and project managers to create user-centric and on brand digital touchpoints.
Although some tools and systems have technical limitations for the implementation of visual details, this guideline helps to ensure a common look and feel of the Henkel brand in all digital applications. The digital design guideline is a living system and is constantly being updated end enlarged to meet the newest requirements and technical standards.
This guideline is divided into three chapters:
Please note: Whenever you are planning to create a new digital application, please make sure in advance that you are using the right platforms, tools and systems approved for Henkel. Also for legal and technical reasons, we always recommend aligning new app and website concepts with the responsible contact partners at Legal, DX and Corp Comm before starting a project. The Corporate Branding team is happy to help in terms of brand strategy and design questions.
The Henkel logo is an essential element in all digital touchpoints. Please ensure to position it based on the defined branding guidelines.
Depending on the background, the Henkel logo can be applied in white or red color. A secondary black-and-white logo may be used in exceptional cases only. The respective color is to select based on the best legibility and is predefined for all color combinations. An overview of the correct logo color on different backgrounds as well as all details about the general logo guideline can be found in the chapter Logo.
Logo versions
Logo on different backgrounds
When placing the Henkel logo on your digital applications please always ensure enough space around it. Our defined protection area ensures a well balanced logo placement. To help you with the definition of the protection area we defined buidling boxes which size is set based on the respective layout size. The logo including its protection area has a total height of seven building modules.
You can find a list with the sizes of the building boxes for the corresponding screen size below. This information can be used for orientation, depending on the options your digital system offers for defining distances and alignments.
Download the Henkel logo for your digital applications here.
The right use of colors plays an important role for the user experience of every digital touchpoint. A balanced color concept makes it possible to structure content more clearly, design navigation elements more intuitively and make the user interaction perfectly fluid. The following guideline enables you to use the Henkel color concept senseful and effectively in your digital applications. All details on the general color guideline can be found in chapter Colors.
As defined in Henkel's color guidline, the colors Henkel red and white are used as primary colors. These colors ensure brand recognition in all our digital touchpoints. To ensure sufficient contrast and at the same time achieve a harmonious look & feel, we have defined the color dark gray as the main color for body text, secondary headings and footer areas. Examples on how the individual colors are used in the overall layout can be found in the section color balance.
HENKEL RED
RGB 225/0/15
HEX #e1000f
DARK GREY
RGB 59/59/59
HEX #3B3B3B
WHITE
CMYK 0/0/0/0
RGB 255/255/255
HEX #FFFFFF
Our extended color palette offers numerous opportunities to visualize our various topics in a dynamic, bold and progressive way. Exclusively for use in digital applications, lighter color shades have been defined as additional background color option. They offer the possibility of further structuring different content areas within the various page sections.
Examples on how the individual colors are used in the overall layout can be found in the section color balance.
Please note:
As defined in the general color guideline, the colors can only be used with the defined color combination. They can not be mixed in order to ensure brand recognition. The welcoming and progressive color combinations can be used inverted. The substantial colors are used as background colors only.
The color balance plays an important role for the overall look and feel of a digital application. This section shows you the right color balance for your interface design and how you can use the different color shades to optimally structure or highlight your content and thus achieve a perfect user experience.
Below you can see two examples for the optimal color balance in a digital application. Henkel red still serves as anchor within all our digital layouts. It can be used to highlight different sections as background color and is also the main color for buttons, icons and other UI elements. The additional colors with the defined color combinations offer numerous options for further coloring header areas or different sections. The lighter color shades help to structure sections within a larger user interface. Make sure to have enough white space in your application by using a white background for larger sections and also between differen colored sections. By doing this you ensure to not overload your user interface with colors and keep clarity. The footer in dark gray closes the page layout.
The typeface has a significant influence on the overall usability of a digital application. Fonts not only shape the look and feel of an interface design, but also influence the readability and accessibility of all content. The right choice of font style, size and placement is therefore essential for the user journey of digital touchpoints.
The dynamic and innovative Henkel GT Flexa offers numeruos options for expressive to reduced visualizations. The clear typeface of the Segoe UI complements this progressive font in areas with smaller font sizes. It also offers a good solution where system-related technical limitations occur.
All details on the general typography guideline can be found in chapter Typography.
The Henkel GT Flexa can be used for headlines, sublines or copy text based on the technical set up. With its wide range of different font styles, ranging from condensed to expressive and varying in width and spacing, it is particularly suitable for headlines or sections that need to be visually highlighted. The combination of the different font styles in digital applications requires attention and care. This section provides you an overview on the optimal handling of the Henkel GT Flexa in digital applications.
Additional heading style samples
With its clear typeface the Segoe UI is very suitable for smaller body texts. It is also used in all touchpoints and systems where the Henkel GT Flexa cannot be used due to technical limitations. You will find various usage options in the table below.
Information for external users:
To receive the download files, you first have to register for our Brand Hub download portal. Please see the instructions on how to complete the registration. After registration you will receive a confirmation that your access has been activated and you will be able to download the templates.
For Henkel employees, no separate registration is necessary. You will be automatically directed to the download page via Henkel MyID.
Information for Henkel employees:
All Henkel employees should already have an automatically installed basic package of the Henkel GT Flexa on their PC. In case of questions, please contact design@henkel.com.
Information for external suppliers:
Step 1:
Before you register for the typeface download, please make sure that you already have access to the Henkel Digital Asset Platform. If you do not have a user account yet, please register for this portal first. Please find the instructions here.
After your access to the portal has been set-up, you will receive a confirmation e-mail.
Only with the access to this portal you are able to register for the font download in step 2.
Step 2:
After you have filled out the Font Download Registration form and confirmed the End User License Agreement, you will be routed to the download page of the font package.
All Henkel employees already have a basis package of the Henkel GT Flexa with various font styles pre-installed on their computers. There is no need for an additional manual download.