Style Guide
Stoodo
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
white
c2
c2 60, 20, 10, 06
electric indigo
C3
aquamarine
C4
cool grey
C5
yellow
C6
Typography
Headings

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

Text huge

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.

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

Lorem ipsum

uppercase huge

Lorem ipsum dolor sit

uppercase xlarge

Lorem ipsum dolor sit amet

uppercase large

Lorem ipsum dolor sit amet

uppercase regular

Lorem ipsum dolor sit amet

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

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  3. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  4. 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.

“Nulla ut leo faucibus ipsum tristique volutpat vitae eget diam. Ut eget justo a risus blandit finibus.”

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 GuideDocumentationChangelogLicenses