IMPACT Brand Guidelines

IMPACT Brand Guidelines
This is the hub for all brand guidelines, usages, and assets. We built this page to make it as easy as possible for you to deliver on-brand designs while respecting our brand and legal/licensing restrictions.
The Logo

Master Logo

The IMPACT master logo should be used at all times for all IMPACT related content assets. If not possible – one of the other logo variations should be applied (see below), ensuring brand consistency across all communications. If referenced without the logo, IMPACT should be written in all uppercase letters.

Download the Full Logo

IMPACT-Logo--Blue-Full
IMPACT-Logo--White-Full

The “IM”

The IM may also be used as a substitute when the full logo doesn't work for the project.

Download The Half Logo

Space / Size

Please use an appropriate amount of spacing when placing the logo in your composition. As reference, use the size of the arrow as the minimum spacing on all four sides.
boundaries-logo

Minimum Size

Never reproduce the Logo or the “IM” at a size smaller than these recommendations, as it will result in the loss of their impact and readability.
Small%20IMPACT%20Logo
The IMPACT logo should never be:
•  smaller than 100px wide OR 30px tall in digital
•  smaller 35.5mm wide or 11mm tall in print.
Small IM
THE IM” should never be:
•  smaller than 30px wide OR 30px tall in digital
•  smaller 35.5mm wide or 35.5mm tall in print.

Logo Use

It is important that the appearance of the logo remains consistent. The logo should not be misinterpreted, modified, or added to. No attempt should be made to alter the logo in any way. Do not rotate, warp, or disproportionately scale the logo. Its orientation, color and composition should remain as indicated in this document—there are no exceptions.
NoDifferentColor

Do not change the color of the logo

NoDifferentFont

Do not change the logo font

NoLogoRearrangement

Do not rearrange the logo typography from the 'IM'

NoDisproportionLogo

Do not use the logo disproportionately

Colors

Primary Color Palette

The primary palette should be applied in all of IMPACT's marketing communications. The palette has been designed to give a bold and exciting direction to the brand, offering flexibility in conception – online and in print. Percentage tints can be used in any of these colors.
IMPACT Blue

HEX: #1082c1

RGB: 16, 130, 193

CMYK: 83, 40, 2, 0

Dark Grey

HEX: #444444

RGB: 68,68,68

CMYK: 0, 0, 0, 73

White

HEX: #ffffff

RGB: 255,255,255

CMYK: 0, 0, 0, 0

Secondary Color Palette

The secondary palette should be used as a guide for the tone of a color. We intend for the secondary palette to be ever evolving, offering an endless palette to choose from. The main use of the secondary palette is in the creation of icons, illustrations, and call-to-actions seen across the website. The secondary palette can also be used to create unique secondary brands for each one of IMPACT's products. Percentage tints can be set up from any of these colors.
Botticelli

HEX: #C5D6E0

RGB: 197, 214, 224

CMYK: 11, 4, 0, 12

Shakespeare

HEX: #38A4CD

RGB: 56,164,205

CMYK: 58, 16, 0, 20

Venice Blue

HEX: #0C6292

RGB: 12,98,146

CMYK: 53, 19, 0, 43

Jungle Green

HEX: #28B685

RGB: 40,182,133

CMYK: 56, 0, 19, 29

Coral

HEX: #FF7043

RGB: 255,112,67

CMYK: 0, 56, 74, 0

Cardinal

HEX: #D7263B

RGB: 215,38,59

CMYK: 0, 69, 61, 16

Shades of Grey

Shades used either as backgrounds, illustrations, or font colors.
Lightest Grey

HEX: #F2F2F2

RGB: 242, 242, 242

CMYK: 0, 0, 0, 5

Light Grey

HEX: #CCCCCC

RGB: 204, 204, 204

CMYK: 0, 0, 0, 20

Silver

HEX: #999999

RGB: 153,153,153

CMYK: 0, 0, 0, 40

Medium Grey

HEX: #666666

RGB: 102,102,102

CMYK: 0, 0, 0, 60

Blue Grey

HEX: #5F696C

RGB: 95, 105, 108

CMYK: 5, 1, 0, 58

Gradient Shades

Gradients can be used as overlays at any opacity over images or as background on images.
IM Blue Gradient

#1e539c > #1082c1

Light Blue Gradient

#1074c1 > #38a4dc

Green Gradient

#006f5b > #25b685

Orange Gradient

#d64635 > #d64635

Typography

Primary Font

Our font families should be used for all communications, ensuring a consistent look and feel in all online and print literature. Proxima Nova should be used for all text treatments. To ensure a consistent look, make sure fonts are used in a consistent manner and the weights of the font have been considered, using heavier weights for headers and to highlight key messages.
proxima-nova-text

Headings

H1

The quick brown fox jumps over the lazy dog.

H2

The quick brown fox jumps over the lazy dog.

H3

The quick brown fox jumps over the lazy dog.

H4

The quick brown fox jumps over the lazy dog.

H5
The quick brown fox jumps over the lazy dog.
H6
The quick brown fox jumps over the lazy dog.
P

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dolor ipsum, cursus vitae dapibus sit amet, tristique vitae mi. Mauris eros magna, aliquam a faucibus at, gravida vel dui. Quisque sit amet dapibus libero. Integer quis nisi non arcu lobortis sodales.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dolor ipsum, cursus vitae dapibus sit amet, tristique vitae mi. Mauris eros magna, aliquam a faucibus at, gravida vel dui. Quisque sit amet dapibus libero. Integer quis nisi non arcu lobortis sodales.

Photography

Image Tone

To make sure that all bases have been covered in the development of the IMPACT brand, a series of example images have been developed to suggest direction. Images of people collaborating, appropriate office scenes, are some appropriate examples. When using photography for the brand, first try to use IMPACT's custom photography. If there are no appropriate photos available from those assets, websites such as Shutterstock and StockSnap are acceptable as well.
Photo Feature
Photo Feature
Photo Feature
Photo Feature
Icons & Illustrations

Icons

IMPACT has several sets of icons it uses both for print and web. Downloads of those sets can be found below and should be used for anyone working on a branded project for the organization.

Font Awesome Icons

CSS & SCSS Download

Social Media Icons

Download AI Files

General Website Icons

Download Vector Files

Digital Marketing Icons

Download PNGs

Simple One Color Icons

Download PNGs

Illustrations

To reflect the company as a whole and to inject personality into the brand, a series of product icons have been designed to achieve just that.
Outbound_Marketing_vs_Inbound_Marketing
Inbound_Marketing_Benefits
Educating_Buyers_on_Product
expected-roi-hero-graphic
IMPACT+

IMPACT+ Logos

The IMPACT Plus logo should be used at all time for all IMPACT Plus related content assets. If not possible – one of the other logo variations should be applied, ensuring brand consistency across all communications. Logo choice depends on the use case and available spacing.

Download All Logos

Colors

Primary Color Palette

The primary palette should be applied in all of IMPACT+ communications. The palette has been designed to give a bold and exciting direction to the learning platform, offering flexibility in conception – online and in print. Percentage tints can be used in any of these colors.
Cloud Burst

HEX: #374151

RGB: 55, 65, 81

CMYK: 79, 67, 48, 37

Mana

HEX: #4965f6

RGB: 73, 101, 246

CMYK: 75, 64, 0, 0

Algae

HEX: #5dc587

RGB: 93, 197, 135

CMYK: 62, 0 , 64, 0

Secondary Colors

The secondary palette should be used as a guide for the tone of a color. We intend for the secondary palette to be ever evolving, offering an endless palette to choose from. The main use of the secondary palette is in the creation of icons, illustrations, and call-to-actions seen across the website. Percentage tints can be used for any of these colors.
IMPACT Blue

HEX: #1082c1

RGB: 16, 130, 193

CMYK: 83, 40, 2, 0

Sunshine

HEX: #fce96a

RGB: 252, 233, 106

CMYK: 3, 3, 71, 0

Midnight

HEX: #161e2e

RGB: 22, 30, 46

CMYK: 87, 77, 53, 66

Storm Cloud

HEX: #6b7280

RGB: 107, 114, 128

CMYK: 62, 50, 38, 10

Light Grey

HEX: #d2d6dc

RGB: 210, 214, 220

CMYK: 16, 11, 8, 0

Haze

HEX: #f4f5f7

RGB: 244, 245, 247

CMYK: 3,2,1,0

White

HEX: #ffffff

RGB: 255, 255, 255

CMYK: 0,0,0,0

Typography

Primary Font

Our font families should be used for all communications, ensuring a consistent look and feel in all online and print literature. Proxima Nova should be used for all text treatments. To ensure a consistent look, make sure fonts are used in a consistent manner and the weights of the font have been considered, using heavier weights for headers and to highlight key messages.
H1
Font Size: 48px
Font Weight: 800
Text Style: Standard
Line Height: 1.25em or 60px
H2
Font Size: 36px
Font Weight: 800
Text Style: Standard
Line Height: 1.25em or 45px
H3
Font Size: 30px
Font Weight: 700
Text Style: Standard
Line Height: 1.25em or 38px
H4
Font Size: 24px
Font Weight: 700
Text Style: Standard
Line Height: 1.25em or 30px
H5
Font Size: 20px
Font Weight: 700
Text Style: Standard
Line Height: 1.25em or 25px
H6
Font Size: 18px
Font Weight: 500
Text Style: Standard
Line Height: 23px
p
Font Size: 16px
Font Weight: 500
Text Style: Standard
Line Height: 1.5em or 24px