Corporate Identity

Our visual identity is designed to maximize the power of the Exact brand, making sure that we offer a coherent customer journey and contribute to the equity of the brand.

Rationale

The basis of Exact’s identity is professional, business-like, responsive and communicative. It shows a clear Exact signature while communicating through different channels, through different touch-points and to a variety of audiences.

The key design property is the ‘backbone’. It is literally the backbone of all touch points. Whatever the messages and design elements (like photography or illustrations); the backbone is always there, defining the lay-out, creating a clear and sharp overall image, making sure all elements find their logical place. The backbone enables flexibility and diversity, and makes sure the way we present ourselves is always recognizable, consistent and distinguished. It will strengthen the positioning of Exact and increase the efficacy of our marketing and communication efforts. Whatever the purpose and the message; people will always recognize Exact.

Brandguide

We have an extensive brandguide for all die-hard designers, creatives, photographers and skilled communication experts. In which all elements of the corporate identity are described in detail. Use this in briefing, development and production.

Checklist

Do you want to know how you judge resources on their appearance? Then this short checklist is ideal. Use it to your advantage! Need help? You can always send new resources through Brandmanagement. We love to help you out.

Exact Design System

The design system of Exact is flexible. Use the backbone to structure your content. If you add a photo to the design, the margin adapts with it. Always include the Exact logo. See examples.

The Exact grid

Our design system is inextricably linked to our grid; the invisible basis of all our expressions. This grid ensures that we build all our communications coherently and consistently. The grid system can be flexibly applied to all formats, both digital and print.

To help you get started with applying the grid, we offer it in different formats. So that this basis is easy to apply.

Document grid

The Exact identity is based on a 6-square grid. It is calculated by dividing the width of the short side of your carrier by 6 and then by dividing the result of that by 4.

For an A4 paper size 1 grid square will be 8,75mm (210/6 = 35 > 35/4 = 8,75). The grid starts at the top. If the grid runs out of squares at the bottom you add 2 squares to make it equal to the starting point of the layout.

Din-format Grids

A617,5>4,375 mm

A524,75>6,18 mm

A435>8,75 mm

A349,5>12,375 mm

A270>17,5 mm

A199>24,75 mm

A0140>35 mm

Exact

 

Example landscape in pixels

For a landscape item of 1195px by 720px 1 grid square will be 120px (720/6 = 120 > 120/4 = 8,75).

The grid starts on the left side. If the grid runs out of squares at the end you add 2 squares to make it equal to the starting point of the layout.

Exact

The Backbone

The backbone helps to add focus and structure to designed content. It is the backbone of the Exact design system that helps the designers to structure designs varying from print to online.

Placement backbone

Always start with placing the backbone in your design on the grid. The backbone can be positioned vertically left, right or in the centre. Horizontally the backbone can be placed in the bottom or at the top.

Backbone Colour

It is always required to use the Exact red at the backbone together with 2 different secondary identity colours.

It’s not possible to create a backbone with only 1 or 2 colours.

Exact

Backbone Length

The backbone should always reach from the beginning till the end of an item. It cannot stop mid-way and should be cut off by the borders of the item. Online there are exceptions since a web page can be infinitely long.

Backbone Width

We calculate the width of the backbone by using the Exact grid. The minimal width for the backbone is 1 grid block. The maximum width of the backbone is 4 grid blocks.

Margin

The document margin is 2 grid blocks from the sides and from the backbone (see red line in the pages on the right).

Exact

 

Transparency

When we use photography or video we use the backbone to place the content. This part of the backbone should reach the same height or width as the content box. We overlay this part of the backbone on top of the content in “multiply”. By doing this, the backbone becomes transparent and the content will be visible in the same colour as the backbone. The backbone can grow in size (see example).

Exact

Brand Elements

Exact
Exact

Colour

Colour is a powerful component of any design system. It is often the first-perceived attribute of a brand and creates an undeniable first impression in the minds of the audience. Colour can be used to create excitement, set a mood, and express personality. The Exact colour palette is composed of primary colours and a set of secondary colours. For websites, a specific colour palette is created (see RGB colour shades).

Primary colours

Exact red is our primary colour and should always be your first choice. This red comes in 3 variations. The red range is to be used for all communication. Red is the leading colour above white, grey and black.

Red
#e1141d
C0 M100 Y100 K0

White
#ffffff
C0 M0 Y0 K0

Black
#000000
C0 M0 Y0

Grey
#dadede
C13 M7 Y9 K0

Secondary colours

The Exact identity consists of a range of 4 secondary colours. These colours give the

opportunity to add emotion to the Exact identity. The Exact purple and ochre yellow represent a fresh young and fast appearance. The dark blue and brown we use for more mature and business designs. The colours can be combined in order to visualize the right feeling.

Purple
PMS: 2097 C
RGB #8200DF
C75 M100 Y0 K0

Ochre yellow
PMS: 110 C
RGB #DBAE29
C20 M30 Y100 K0

Brown
PMS: 7530 C
RGB #BAA488
C28 M33 Y48 K0

Blue
PMS: 654 C
RGB #00467B
C100 M79 Y27 K11

RGB Colour shades

For web only the Exact identity colours comes in a range of 2 extra tints. These RGB colours enable us to make more subtle web designs with a broader colour range.

hex: #7f2320
class:
bg-red-100
fg-red-100

hex: #9c1f1e
class:
bg-red-80
fg-red-80

hex: #e1141d
class:
bg-red-60
fg-red-60

hex:#F9D0D2
class:
bg-red-40
fg-red-40

hex:#FCE7E8
class:
bg-red-20
fg-red-20

hex: #000000
class:
bg-black-100
fg-black-100

hex: #333333
class:
bg-black-80
fg-black-80

hex: #666666
class:
bg-black-60
fg-black-60

hex: #999999
class:
bg-black-40
fg-black-40

hex: #CCCCCC
class:
bg-black-20
fg-black-20

hex: #787a7a
class:
bg-grey-100
fg-grey-100

hex: #939595
class:
bg-grey-80
fg-grey-80

hex: #a5a9a9
class:
bg-grey-60
fg-grey-60

hex: #c9caca
class:
bg-grey-40
fg-grey-40

hex: #dadede
class:
bg-grey-20
fg-grey-20

hex: #baa488
class:
bg-beige-100
fg-beige-100

hex: #c8b6a0
class:
bg-beige-80
fg-beige-80

hex: #d7ccbd
class:
bg-beige-60
fg-beige-60

hex: #e3dbcf
class:
bg-beige-40
fg-beige-40

hex: #f8f5f3
class:
bg-beige-20
fg-beige-20

hex: #dbae29
class:
bg-mustard-100
fg-mustard-100

hex: #e2be54
class:
bg-mustard-80
fg-mustard-80

hex: #ebd186
class:
bg-mustard-60
fg-mustard-60

hex: #f1dfa9
class:
bg-mustard-40
fg-mustard-40

hex: #f9f2dc
class:
bg-mustard-20
fg-mustard-20

hex: #8200df
class:
bg-purple-100
fg-purple-100

hex: #9b33e5
class:
bg-purple-80
fg-purple-80

hex: #ba83eb
class:
bg-purple-60
fg-purple-60

hex: #cd99f2
class:
bg-purple-40
fg-purple-40

hex: #f2e7fb
class:
bg-purple-20
fg-purple-20

hex: #00467b
class:
bg-navy-100
fg-navy-100

hex: #336b95
class:
bg-navy-80
fg-navy-80

hex: #7e9eb7
class:
bg-navy-60
fg-navy-60

hex: #cbd8e2
class:
bg-navy-40
fg-navy-40

hex: #e6ecf1
class:
bg-navy-20
fg-navy-20

Call to action

In order to create a high contrast between the identity colours and buttons that need attention, the Exact identity uses a bright positive blue for CTA buttons.

Button primary
Primary
hex default: #0650D0
hex hover: #3873D9
hex active: #0442AE
hex color: #FFFFFF
class: btn btn-blue

Button secondary
Secondary
hex default: #CDDCF6
hex hover: #E3E8FA
hex active: #B4CAF0
hex color: #B4CAF0
class: btn btn-light-blue

Blue text link
This is a link
hex default: #0650D0
hex hover: #6A96E3
class: btn link-blue

White text link
This is a link
hex default: #FFFFFF
hex hover: #FFFFFF
class: btn link-white

Typography

Typography is used to differentiate sections of information or to emphasize a word or phrase. Done right, your use of type will draw readers’ attention, lead them to the most important information first, and maintain a sense of clarity, order, legibility, and structure throughout your written communication.

The selected typeface for Exact is the Apax. It has a playful and open look. Creative agencies and partners order the font themselves. This way licenses are always guaranteed.

Apax

The Apax family is available in 6 styles and their matching italics. For the Exact identity, we use 2 weights from the family: Apax Regular and Apax Medium.

Choosing from this combination of weights, you can use the Apax to create a clear and consistent visual hierarchy.

The Apax Regular, Medium and other weights (if needed) are available for purchase at www.optimo.ch

Exact

Header highlighting

The Exact product helps you to focus. To see what is important. To reflect this principle, we use a red highlight in headers. Highlighting typography is only possible on white, red or black backgrounds.

Secondary color backgrounds

If we use typography on top of a secondary coloured background we only use white. Typography cannot be used in secondary identity colours.

Exact

Secondary typeface

For the Exact product, internal presentations, online presence and internal documents such as Microsoft® Office applications the typeface Arial is used.

Exact

Icons

The Exact communication icons must always be flat and outlined. When designing your own icons, always stay within the blond feel of the Exact brand. And always make sure these icons are fit for use in different formats.

Communication icons

We use this icon style to explain a story. Do not use these icons for functional purposes such as navigation.

Business software

Highlight in icon

To highlight an important part of the icon we use one of the Exact identity colours.

Business software

Colour background

The same colour highlighting rules for typography are applied to icons. It is only possible to highlight on primary colour backgrounds. In case of secondary colour backgrounds, we use the icons in white or black.

Business software

Functional icons

Sometimes we use icons for a more practical reason. When icons need to be still functional while they are really small they need to be bold and solid. A complicated design does not work in this case. For this reason, we use the Raw icon set made by Dutchicon.

Business software

Visual language

Photography is an important means to create a brand that stands out. Our distinctive photographic style brings the Exact brand to life. Ensuring a consistent style and quality of photography strengthens the brand across all media.

Our images should not just repeat what our words are already telling and should stay away from the usual business clichés. Our imagery creates a broader canvas, sketching the Exact world and attitude. Note: in campaigns, other imagery is permitted.

Guiding principles

For all the photography of Exact we use pictures with natural lightning. Models wear natural clothes fitting to their work and workplace. The pictures are warm and colorful. Pictures need to feel natural, not too posed, or over the top.

People

This category is about people. The pictures are always portraits. The people are portrayed in their own business setting, be it a cafe or office. With this category we focus on the variety of people and their different businesses, each with their own unique qualities and professionalism.

Exact

Energy

One of keywords of the Exact identity is communication. Therefor we show the interaction and energy between people. They can share a good moment, have a laugh or collaborate together. The pictures are warm and always have a positive atmosphere. In the pictures we show at least two persons and it is clear there is a connection between them.

 

Exact

Technology

Sometimes pictures of technology are important for communication. For this we always use a picture of technology in combination with a person who is actively using the technology (i.e. laptop, mobile device etc.). The pictures use detail photography by focusing only the device and signs of the person using it.

Exact

Doodle

If we want to express the Exact personality and add meaning to a photo we use our own doodle photography style. The doodles give an extra (funny and playful) meaning to the image.

The first layer consists of the original photo depicting a person doing something. Choose a photo that communicates your message. We mainly use photos of customers in their work environment.

The second layer is a doodle drawing on top of the photo. Doodles are simple drawings, or fast sketches. They do not have to be perfect. We always use red for doodle drawings.

Exact

Examples

If you are fully aware of what Exact stands for and what the brand looks like, you can get started. Here you will find examples of ways in which the corporate identity has been applied, templates and all downloads.

Our corporate identity offers plenty of room for variation. In fact, we are looking for that! Because it gives flexibility. It’s nice to know how big the sandbox is. That is why we have collected examples of designs for you to be inspired by.

 

The backbone for online

new-website-devices-01-copy.jpg
New-Website-HP-Macbook-01.gif
New-Website-Start-UpsSmall-Companies.gif
new-website-psa-phone-02.png
new-website-psa-phone-03.png
new-website-psa-phone-01.png
new-website-hp-phone-01.png
New-Website-TryNow-01.gif

The backbone for products

Business software

The backbone for growth

Business software
Business software

The backbone for outdoor

print4.png
print31.jpeg

The backbone for social

digital-4.png
digital-5.gif
digital6.png
digital7.png

The backbone for events

event-1a.png
instagram1080x1080-3.png
event-1b.png
instagram1080x1080-2.png
event-2a.png

The backbone for your performance

Downloads

All available documentation, guidelines and downloads in one overview. Do you still miss a document? Contact Creative Services via creativeservices@exact.com

Brand guide

Logo

Grid

  • Grid
EN Select your country