Defined and flexible core structure we can use on all or most pages.
<section-stylesheet>
fullscreen width
<section-hero-stylesheet>
10o viewport height, fullscreen width
<content-wrap-stylesheet>
fullscreen width
HTML tags define default Heading styles.
HTML tags define default text styles.
<p-stylesheet>
Default body text, Freight-sans-pro, 400-normal
Sample text helps you understand how real text may look.
<quote-stylesheet>
Sample text helps you understand how real text may look on your website.
Text classes when typography style doesn't match the default HTML tag.
Manage recurring text and background colors.
<teal-stylesheet>
#00b2d0
<blue-stylesheet>
#0084a5
<dark-blue-stylesheet>
#075476
<light-blue-stylesheet>
#e8f9ff
<orange-stylesheet>
#f78321
<dark-orange-stylesheet>
#e56526
<grey-stylesheet>
#a9abb0
<light-grey-stylesheet>
#f7f9fc
<dark-grey-stylesheet>
#384450
<black-stylesheet>
#131313
<white-stylesheet>
#ffffff
<text-teal-stylesheet>
#00b2d0
<text-blue-stylesheet>
#0084a5
<text-dark-blue-stylesheet>
#075476
<text-light-blue-stylesheet>
#e8f9ff
<text-orange-stylesheet>
#f78321
<text-dark-orange-stylesheet>
#e56526
<text-grey-stylesheet>
#a9abb0
<text-light-grey-stylesheet>
#f7f9fc
<text-dark-grey-stylesheet>
#384450
<text-black-stylesheet>
#131313
<text-white-stylesheet>
#ffffff
<shadow-soft-stylesheet>
<shadow-strong-stylesheet>
Native Webflow elements with Client-First classes applied.
<rich-text-stylesheet>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Block quote
Bold text
Emphasis
Button combo class system.
Utility spacing system - padding classes. [padding-direction] + [padding-size].
Utility spacing system - padding classes. [margin-direction] + [margin-size].
<small-icon-stylesheet>
<medium-icon-stylesheet>
<big-icon-stylesheet>
<grid-2-stylesheet>
<grid-3-stylesheet>
<grid-4-stylesheet>
<flex-h-stylesheet>
<flex-v-stylesheet>
Utility classes we like to use in most of our projects to build faster.