Style Guide

Starting the website with global typography is the easiest way to build a scalable website.

Fonts

Inter Tight

DOWNLOAD

Headings

A Moverism project —
2493 and beyond.
The brutalist way.

Jumbo H1 / 75px / 1.1 EM

A Moverism project —
2493 and beyond.
The brutalist way.

H1 / 60px / 1.1 EM

A Moverism project —
2493 and beyond.
The brutalist way.

H2 / 50px / 1.1 EM

A Moverism project —
2493 and beyond.
The brutalist way.

H3 / 40px / 1.1 EM

A Moverism project —
2493 and beyond.
The brutalist way.

H4 / 30px / 1.3 EM
A Moverism project —
2493 and beyond.
The brutalist way.
H5 / 20px / 1.3 EM
A Moverism project —
2493 and beyond.
The brutalist way.
H6 / 16px / 1.3 EM

Paragraphs - Small, Normal & Big

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Small Paragraph/ 14px / 1.8 EM

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Paragraph/ 17px / 1.8 EM

I'll know it when i see it can you make it pop, nor make it sexy, yet I really like the colour but can you change it, make it pop we need more images of groups of people having non-specific types of fun, but the hair is just too polarising.

Big Paragraph/ 20px / 1.8 EM

Labels - Small, Normal & Big

This is some text inside of a div block.
Small Label/ 12px / 1.4 EM
This is some text inside of a div block.
Normal Label/ 14px / 1.6 EM
This is some text inside of a div block.
BIG Label/ 16px / 1.8 EM

Other Texts

Link - Lorem ipsum dolor sit amet
Link/ 17px / 1.8 EM

Bold - Lorem ipsum dolor sit amet

BOLD/ 17px / 1.8 EM

Italic - Lorem ipsum dolor sit amet

ITALIC/ 17px / 1.8 EM

Misc

Workflow ecosystem run it up the flag pole what the. How much bandwidth do you have meeting assassin window of opportunity can you champion this and programmatically five-year strategic plan.
Block QUote / 22px / 1.8 EM
  • I know you've made thirty iterations but can we go back to the first one
  • I know you've made thirty iterations but can we go back to the first one
  • I know you've made thirty iterations but can we go back to the first one
BULLET LIST
  1. I know you've made thirty iterations but can we go back to the first one
  2. I know you've made thirty iterations but can we go back to the first one
  3. I know you've made thirty iterations but can we go back to the first one
NUMBERED LIST

Rich Text

This is Heading 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.

‍

Image from Unsplash

‍

This is Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  3. Sapien in tempus lectus lorem quis est.

‍

This is Heading 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales sapien, in tempus lectus lorem quis est.

‍

This is Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Ut sollicitudin, diam ut efficitur pharetra, mauris augue sodales.
  • Sapien in tempus lectus lorem quis est.

‍

This is Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.

‍

This is Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus.