Mailbiz - Style Guide

Typography

H1

F
‍700 Bold
‍Font Size: 4.2em
Leading: 125% (entrelinhas)

H2

Fira Sans
700 Bold
‍Font Size: 3.2em
Leading: 125% (entrelinhas)

H3

Fira Sans
700 Bold
‍Font Size: 2.4em
Leading: 125% (entrelinhas)

H4

Fira Sans
700 Bold
‍Font Size: 2em
Leading: 125% (entrelinhas)

H5

Fira Sans
700 Bold
‍Font Size: 1.8em
Leading: 125% (entrelinhas)

Paragraph

Montserrat
400 Normal
‍Font Size: 1.8em
Leading: 150% (entrelinhas)

Inter
400 Normal
‍Font Size: 1.8em
Leading: 150% (entrelinhas)

Block Quote

Montserrat
400 Normal
‍Font Size: 1.125em / 1.125em / 1.125em / 1.125em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)

H1

H2

H3

H4

H5
H6

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

  • List item
  • List item
  • List item
  1. Numbered list item
  2. Numbered list item
  3. Numbered list item

H1 - RICH TEXT BLOCK
Montserrat - 700 Bold
Font Size: 5em / 3.75em / 3.125em / 2.5em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

H2 - RICH TEXT BLOCK
Montserrat - 700 Bold‍
Font Size: 3.75em / 2.5em / 2.5em / 1.875em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

H3 - RICH TEXT BLOCK
Montserrat - 700 Bold‍
Font Size: 2.5em / 1.875em / 1.875em / 1.25em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

H4 - RICH TEXT BLOCK
Montserrat - 700 Bold‍
Font Size: 1.25em / 1.25em / 1.25em / 1.125em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

H5 - RICH TEXT BLOCK
Montserrat - 700 Bold‍
‍Font Size: 1.125em / 1.125em / 1.125em / 1.0625 (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

H6 - RICH TEXT BLOCK
Montserrat - 700 Bold‍
Font Size: 1em / 1em / 1em / 1em (bodytype)
Leading: 1em (entrelinhas)
Kerning: Normal (entreletras)
Margin bottom: 0.3em

Paragraph - RICH TEXT BLOCK
Montserrat - 400 Normal
‍Font Size: 1em / 1em / 1em / 1em (bodytype)
Leading: 1.3em (entrelinhas)
Kerning: Normal (entreletras)

List Item / Numbered List Item - RICH TEXT BLOCK
Montserrat - 400 Normal
‍Font Size: 1em / 1em / 1em / 1em (bodytype)
Leading: 1.5em (entrelinhas)
Kerning: Normal (entreletras)

Text block

Montserrat
400 Normal
‍Font Size: 1.8em
Leading: 150% (entrelinhas)

Basic

  • List Item
  • List Item
  • List Item

Montserrat
400 Normal
‍Font Size: 1em / 1em / 1em / 1em (bodytype)
Leading: 1.5em (entrelinhas)
Kerning: Normal (entreletras)

  1. Numbered list item
  2. Numbered list item
  3. Numbered list item

Montserrat
400 Normal
‍Font Size: 1em / 1em / 1em / 1em (bodytype)
Leading: 1.5em (entrelinhas)
Kerning: Normal (entreletras)

Botao principal

Fira Sans
600 Semi-Bold
‍Font Size: 1.8em
Leading: 56px
Class : c-button-primary

Fira Sans
600 Semi-Bold
‍Font Size: 1.8em
Leading: 56px
Class : c-button-secondary

Color Palette

Primary Colors

Color Name: primary-colors-dark
HEX: #159096

Color Name: primary-colors-pure
HEX: #2ECAD2

Color Name: primary-colors-medium
HEX: #B4F1F4

Color Name: primary-colors-light
HEX: #F3FAFB

Secondary Colors

Color Name: secondary-colors-dark
HEX: #ECDA00

Color Name: secondary-colors-pure
HEX: #F9EF75

Color Name: secondary-colors-medium
HEX: #B4F1F4

Color Name: secondary-colors-light
HEX: #B4F1F4

Neutral Colors

Color Name: neutral-colors-100
HEX: #182D37

Color Name: neutral-colors-200
HEX: #465B6F

Color Name: neutral-colors-300
HEX: #7A8B99

Color Name: neutral-colors-400
HEX: #A0AAB2

Color Name: neutral-colors-500
HEX: #D1D6DA

Color Name: neutral-colors-600
HEX: #F1F4F5

Complementary Colors

Color Name: complementary-colors-green
HEX: #5EB280

Color Name: complementary-colors-yellow
HEX: #FFCE78

Color Name: complementary-colors-orange
HEX: #FD8469

Color Name: complementary-colors-red
HEX: #FE5B50

Forms

O seu cadastro foi confirmado
Oops! Something went wrong while submitting the form.