Zel Style Guide

Branding Guidelines for the Zel Brand

Logos

Colors

Warm Black	Off White	Dark Blue (Text)	Blue (Background)
#232220	#f7f7f7	#142a59	#183c87
rgb(35,34,32)	rgb(247,247,247)	rgb(20,42,89)	rgb(24,60,135)

Fonts

Font name

Heebo (Google Font) [Main]

CSS

<style>
    .zel {
    	font-family: 'Heebo', sans-serif;
        font-weight: 500;
    }
    .thin {
        font-weight: 100;
    }
</style>

HTML

<link href="https://fonts.googleapis.com/css?family=Heebo:100,500" rel="stylesheet">
<p class="zel">zel<span class="thin">cash</span></p>

Font name

Roboto (Google Font) [Alternative]

CSS

<style>
    .zel {
        font-family: 'Roboto', sans-serif;
        font-weight: 500;
    }
    .thin {
        font-weight: 100;
    }
</style>

HTML

<link href="https://fonts.googleapis.com/css?family=Roboto:100,500" rel="stylesheet">

<p class="zel">zel<span class="thin">cash</span></p>

Use

letter-spacing: -2px;

if font-size larger than 50px