This page contains all the components used on your site. You can see it as a library where you can consult and edit any style. If you are beginning with Webflow, we highly recommend you to take a look at the Webflow 101 Crash Course.
These are all the text styles used on your site. Add the following classes to change the alignment: Center, Right.
Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Formatted rich text element used for long sections of text like projects
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Here is a text link for your rich text element.
"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 you will find all the colors used on your site. Applying a color palette brings a unified and recognizable consistency to your interfaces.
Buttons are used to initialize an action. Use clear button labels to express what action will occur when the user interacts with it.
Primary
Listen nowSecondary
Listen nowA form is a group of related input controls that allows users to provide data or configure options.
Grid give you more direct control over your layout and design.
4 Grid
3 Grid
2 Grid
Boxes of different sizes to house content.
400px
500px
600px
1000px
Spacing is important and often overlooked in product design. Using white space elements rather than adding margin on your components will help you to achieve a coherent spacing system.
To use spacers, add a div in your design and give it the name "Spacer". Then select a combo class (ex: 32) to set its size.
8px
16px
24px
32px
40px
