Webflow Style Guide

Browse the UI Elements available on the Designer Template. Designer is a Design Portfolio Webflow Template by BRIX Templates.

Colors

Primary Colors

Primary 1
#7051EF

Secondary Colors

Secondary 1
#4770FF
Secondary 2
#FF6C98
Secondary 3
#F7F6FF
Secondary 4
#EFF4FF
Secondary 5
#FFF4FA

Neutral Colors

Neutral 700
#3A395E
Neutral 600
#6E6D8F
Neutral 500
#80809D
Neutral 400
#E5E5EA
Neutral 300
#F7F7FA
Neutral 200
#FAFAFC
Neutral 100
#FFFFFF

Typography

Rich Text

Heading H1 - Aa Bb Cc Dd

Heading 1 - 66px/1.182em

Heading H2 - Aa Bb Cc Dd

Heading 2 - 48px/1.250em

Heading H3 - Aa Bb Cc Dd

Heading 3 - 28px/1.286em

Heading H4 - Aa Bb Cc Dd

Heading 4 - 24px/1.333em
Heading H5 - Aa Bb Cc Dd
Heading 5 - 20px/1.400em
Heading H6 - Aa Bb Cc Dd
Heading 6 - 18px/1.444em

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.778em

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 Large - 20px/1.8em

Bold - Lorem ipsum dolor sit amet

Bold Text

Italic - Lorem ipsum dolor sit amet

Italic Text
Design - Designer Webflow Template
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Figure & Figure Caption
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquet euismod ullamcorper.
Block Quote

Buttons

Small
Button Primary - Small
Default
Button Primary - Default
Large
Button Primary - Large
Small
Button Secondary - Small
Default
Button Secondary - Default
Large
Button Secondary - Large