Theme Styles
Symbols

Conzoom Style Guide

Her are all the relevant styling is gathered

Colors

Primary Colors

Primary 1
#d0291a

Secondary Colors

Secondary 1
#ECECEC

Red Colors

Red 900
#751c14
Red 800
#8a1d14
Red 700
#a32419
Red 600
#bc2315
Red 500
#d0291a
Red 400
#e02e1e
Red 300
#f04334
Red 200
#ff5f51
Red 100
#fd988f
Red 50
#f4ccc9
Red 30
#F5EAE9

Grey Colors

Grey 900
#141414
Grey 800
#515151
Grey 700
#666666
Grey 600
#858585
Grey 500
#989898
Grey 400
#B8B8B8
Grey 300
#CCCCCC
Grey 200
#E1E1E1
Grey 100
#EBEBEB
Grey 50
#F5F5F5

Group Colors

A
B
C
D
E
F
G
H
I

Type Colors

A1
A2
A3
A4
A5
B1
B2
B3
B4
B5
C1
C2
C3
C4
C5
D1
D2
D3
D4
E1
E2
E3
E4
E5
E6
F1
F2
F3
F4
G1
G2
G3
G4
H1
H2
I1
I2
I3
I4

Typography

Rich Text

Heading H1 - Aa Bb Cc Dd

Heading 1 - 58px/1.034em

Heading H2 - Aa Bb Cc Dd

Heading 2 - 38px/1.237em

Heading H3 - Aa Bb Cc Dd

Heading 3 - 24px/1.250em

Heading H4 - Aa Bb Cc Dd

Heading 4 - 20px/1.400em
Heading H5 - Aa Bb Cc Dd
Heading 5 - 18px/1.222em
Heading H6 - Aa Bb Cc Dd
Heading 6 - 16px/1.375em

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.

Paragraph Small - 16px/1.625em

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 tristique posuere.

Paragraph Default - 18px/1.667em

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 tristique.

Paragraph Large - 24px/1.583em
Link - Lorem ipsum dolor sit amet
Links

Bold - Lorem ipsum dolor sit amet

Bold Text

Inline Heading

Heading

50%

Italic - Lorem ipsum dolor sit amet

Italic Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquet euismod ut id ullamcorper nunc diam. Amet a ac ut pharetra. Amet, accumsan, nisl in elementum volutpat integer. Cursus est elementum maecenas ut.
Block Quote
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Lorem ipsum dolor sit amet, consectetur.
  • Lorem ipsum dolor sit amet, consectetur adipiscing.
Bullet List
  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Lorem ipsum dolor sit amet, consectetur.
  3. Lorem ipsum dolor sit amet, consectetur adipiscing.
Numbered List

Icons

Buttons

Prøv Conzoom nu
Button Primary - Small