Style guide

Last Updated: Oct 27,2023

This is a h1 Title.

This is a h2 Title.

This is a h3 Title.

This is a h4 Title.

This is a h5 Title.
This is a h6 Title.

Paragraph

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.

Block Quote

Curabitur et condimentum turpis tincidunt sed tellus. Ut maecenas mauris tortor nibh in aliquam pellentesque ac purus. Vestibulum, nulla eget urna viverra cursus quisque hac lorem. Quis tellus, laoreet pretium neque. Iaculis arcu eget.

Unordered List

Ordered List

  1. Here is a simple example.
  2. Here is a simple example.
  3. Here is a simple example.
  4. Here is a simple example.

Image with caption

a couple of women standing next to each other - volunteer - best organization website webflow CMS template

Rich text element h1 Title.

This is a h2 Title.

This is a h3 Title.

This is a h4 Title.

This is a h5 Title.
This is a h6 Title.

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
  • Here is a simple example.
  • Here is a simple example.
  • Here is a simple example.
  • Here is a simple example.
  1. Here is a simple example.
  2. Here is a simple example.
  3. Here is a simple example.
  4. Here is a simple example.

This is a link

Caption

Colors

The different weights of greys and colours used throughout the website.

These colors have been created using Global Swatches. If you edit the Global Swatch color, it will change every element that uses that color swatch.

Accent
Accent Tint
Plum Tint
Plum
Gold
Spring Green
Black
Gray 1
Gray 2
Gray 3
Gray 4
Gray 5
Gray 6
White

Shadows

Global Text Styles

Text Centered

Text Centered On Mobile

Text Accent

Text Secondary

No Margin Top

No Margins

No Paddings

No Paddings Top

Text White

Buttons

These are all the buttons that are used in this project. Editing them will reflect the changes on all the other buttons of the project too.

Label
Button Large
Label
Button Large Light
Label
Button Large Text
Label
Menu CTA
Label
Menu CTA Light
Label
Menu CTA Text

Icons

X logo black - volunteer - best organization website webflow CMS templateinstagram logo - volunteer - best organization website webflow CMS templateyoutube logo - volunteer - best organization website webflow CMS templatefacebook logo - volunteer - best organization website webflow CMS templatean arrow pointing to the - volunteer - best organization website webflow CMS templatea black and white arrow pointing to the right - volunteer - best organization website webflow CMS template

Forms

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Tabs