Style Setup Template

A utility template to help you set up your website’s theme styles.

Primary

Secondary

Tertiary

Dark Background

Light Background

Accent

Color

Style Colors

Manage the essential color system of your layouts by defining these basic colors.

Typography

Heading 1

In Style Kits you have complete flexibility of the Typographic styles. Adjust the styles for the Body and Headings typography panels in Style Kits.

Feature Heading 3

An example with an icon box

This Is A Heading 2

Go to the Style Kit panel, and manage the whole typography on this layout via a number of useful controls. You can also set up your Buttons and Column Gaps.

This Is A Heading 3

This Is A Heading 4

This Is A Heading 5
This Is A Heading 6
Typography

Heading 1

In Style Kits you have complete flexibility of the Typographic styles. Adjust the styles for the Body and Headings typography panels in Style Kits.

Feature Heading 3

An example with an icon box

This Is A Heading 2

Go to the Style Kit panel, and manage the whole typography on this layout via a number of useful controls. You can also set up your Buttons and Column Gaps.

This Is A Heading 3

This Is A Heading 4

This Is A Heading 5
This Is A Heading 6
Text Sizes

This is XXL Text

This is XL Text

This is Large Text

This is Medium Text

This is Small Text

Heading Sizes

XXL Heading

XL Heading

Large Heading

Medium Heading

Small Heading
Buttons

Button Styles

Dynamic button style control

Head over to the Style Kits panel, and open the Buttons tab to customize the style of each button size.

Accent Background

Here’s a section with an accent background color class.