UI Style Guide

Color Patterns

Base Colors
#0A031F
#171526
#0d0525
#ffffff
Accent Colors
#322658
#D4C6FE
#CFF4FF
#FFD2CF
#FFF4CF

Typography Style

Display lg/01

font - Mango Grotesque
Size - 460
Line Hight - 1
Latter spacing - 1

Display Lg/02

font - Mango Grotesque
Size - 380
Line Hight - 1
Latter spacing - 1

Display md/01

font - Mango Grotesque
Size - 366
Line Hight - 1
Latter spacing - 1

Heading md/02

font - Mango Grotesque
Size - 360
Line Hight - 1
Latter spacing - 1

Heading sm/01

font - Mango Grotesque
Size - 320
Line Hight - 1.1
Latter spacing - 1
font - Mango Grotesque
Size - 280
Line Hight - 1.1
Latter spacing - 1

Heading sm/02

Heading 01

font - Mango Grotesque
Size - 250
Line Hight - 1.2
Latter spacing - 0.9

Heading 02

font - Mango Grotesque
Size - 160
Line Hight - 1.2
Latter spacing - 1

Heading 03

font - Mango Grotesque
Size - 115
Line Hight - 1.2
Latter spacing - 0.9

Heading 04

font - Mango Grotesque
Size - 75
Line Hight - 1.2
Latter spacing - 0.9

Heading 05

font - Mango Grotesque
Size - 55
Line Hight - 1.3
Latter spacing - 1

Heading 06

font - Mango Grotesque
Size - 40
Line Hight - 1.3
Latter spacing - 1

Text lg

font - Aspekta
Size - 24
Line Hight - 1.3
Latter spacing - 0

Text Sm

font - Aspekta
Size - 16
Line Hight - 1.5
Latter spacing - 0

rICK tEXT Style

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript