Style Guide

Arch+

Colors

Typography

Rich Text Element

Made by Riffmax

This is the project's style guide. Use this area to keep track of all your global website classes.

Colors

C1 = Color 1
C1 70 = Color 1 with 70% opacity

black

C1

C1 80, 70, 50, 20, 10

white

C2

C2 40, 20, 10

raspberry

C3

Typography

Headings

Heading Huge

heading huge

Heading XLarge

heading XLarge

Heading Large

heading Large

Heading Medium

heading medium

Heading Small

heading small

Heading Tiny

heading tiny

Paragraphs / Texts Sizes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Text Xlarge

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.

Text large

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.

Text Regular

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.

Text Small

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Text uppercase

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.

Text serif

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.

text serif small

Rich Text Element — RTE

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet."

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ullamcorper erat ipsum. Praesent sodales dictum laoreet. Vestibulum laoreet massa nec libero tempor, sit amet auctor orci mattis. Proin tempor diam eget lacinia rhoncus.

rich text

Powered by Webflow

Style Guide Documentation Changelog Licenses