Style Guide
Default
Heading Styles
Heading 1 (h1)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Heading 2 (h2)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Heading 3 (h3)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Heading 4 (h4)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Heading 5 (h5)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Heading 6 (h6)
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Alternative
Heading Styles
Primary Font Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Secondary Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Accent Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Text Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Heading Pairings
These look great together
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Another Pairing
This is a Great Pairing
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Break up the content
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Default Column Gaps
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Second Column
Ulorum suffragio omnium nominati sunt. Duo Reges: constructio interrete. This is a link. Lorem ipsum dolor sit hover link amet, consectetur adipiscing elit. Aenean pulvinar tempus velit, in suscipit nibh rhoncus eget. In dictum id erat lacinia tristique. Nulla condimentum ullamcorper arcu ac commodo. Vivamus id metus non neque tincidunt fringilla.
Default
Button Styles
There are 5 different button styles for you to choose from. Some sizes work best on light backgrounds and others on dark backgrounds.
For Use On Light Background
XS Button Small Button Medium Button Large Button XL ButtonFor Use On Dark Background
XS Button Medium Button Large Button XL ButtonOrganize
Toggles, Accordions & Tabs
Tabs, toggles, and accordions are great ways to organize large amounts of text content.
They keep the content concise and looking organized for your visitors to see easily.
Dark BG Toggles
Toggle Number One Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Second ToggleUt elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Dark BG Accordions
Accordion #1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Accordion #2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Dark BG Tabs
Tab Number 1 Second Tab Here Tab Three Tab Number 1Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Second Tab HereUt elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Tab ThreeLorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Dark BG Toggles
Toggle Number One Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Second ToggleUt elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Dark BG Accordions
Accordion #1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Accordion #2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Dark BG Tabs
Tab Number 1 Second Tab Here Tab Three Tab Number 1Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Second Tab HereUt elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Tab ThreeLorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.