Brand
Guidelines.

The following are the fundamentals that comprise the PPL Labs brand.

Logo

We are very proud of our logo, and require that you follow these guidelines to ensure it always looks its best. 

Primary

Icon

Use of the PPL icon is permitted in certain cases, namely in use for Profile Images or as a Favicon.

logo-1

Primary

Colors

PPL Blue

Active Color
#0070F8

White

Primary
#FFFFFF

Charcoal

Primary
#1A1A1A

Seashell

Secondary
#EBEEF7

PPL Blue is to be used on anything clickable and to emphasize certain elements/visuals.

White is our primary background color and as an alternate font color on dark backgrounds.

Charcoal is our primary font color. It is also permitted to be used as an icon color in certain cases.

Seashell is an alternate background color.

Typefaces

PPL Labs uses two families of fonts:

Proxima Nova

Roboto Slab

H1

Proxima Nova – 60px
Bold

H2

Proxima Nova – 36px
Bold

H3

Proxima Nova – 32px
Bold

H4

Proxima Nova – 28px
Bold

Paragraph

Roboto Slab – 18px
300

Buttons

When properly formatted, PPL Buttons should look like this:

PPL Blue
Proxima Nova – Bold
Border Radius – 3px

Rules with Buttons

In order to maintain a consistency that encourages users to take actions on our website, please refer the following rules regarding buttons.

NO

Buttons must always be PPL Blue.

NO

Button text must always be Proxima Nova.

NO

Button text must always be bold.

NO

Button Text must always be in Caps Case.

NO

Buttons must always have a border radius of 3px

NO

Button Icons should never come after the text.

NO

Buttons should never have hover effects.

NO

Buttons should never have hover animations.