Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Case Study Card
Case Study Card
Icon Card
Icon Card
Heading
Product Card
Product Card
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Resource Card
Resource Card
Style = Standard - Border
Resource Card
Style = Standard - Border
Resource Card
Style = Featured - No Border
Review Card
Review Card
"Elit aliquip deserunt eiusmod non mollit qui minim non cillum amet."
Solution Card
Solution Card
Stat Card
Solution Card
00x
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Tour Card
Tour Card
Quote Card
Quote Card
"Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa."
First Last
Title, Company
Accordion Item
The Accordion Item component should be used within the Accordion List component or a static element with the required attributes. The accordion will not function without the Code / Accordion List - JS script component present and required attributes applied to its wrapper.
Accordion Item
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Avatar
Avatar
Icon List Item
The 'reason to believe' item component should be used within the RTB List component.
Icon List Item
Lorem ipsum
Lorem ipsum
Testimonial Lockup
Testimonial Lockup
"In culpa consectetur irure anim laborum et. Aliquip enim proident laborum non culpa eu sint elit consectetur excepteur velit commodo."
First Last
Company, Title
List - Resource Dynamic
.png)
Icon
Icon / Caret Down
Icon / Check
Icon / X
Image
Image
Aspect Ratio = Landscape 3:2
Image
Aspect Ratio = Landscape 16:9
Image
Aspect Ratio = Landscape 2:1
Image
Aspect Ratio = Square 1:1
Image
Aspect Ratio = Portrait 2:3
Image
Aspect Ratio = Portrait 4:5
Image
Aspect Ratio = Cover
Video
Video
Section Padding
The section padding component can be used to add vertical padding to the top and bottom of sections. The properties for these components can then be passed through to the parent component.
Section Padding
Size = Page Top
Section Padding
Size = Large
Section Padding
Size = Medium
Section Padding
Size = Small
Section Padding
Size = None
Slider
The slider component powered by Swiper.JS to display content in a carousel layout.
Slider
Slider / Slide
Slider slides are for use only inside the main Slider component.
Slider / Slide
Body text
The body text component is useful for adding styled rich-text into components for applications such as sub-headings and accordion content. The body text component should not be used in place of rich-text for long-form content such as articles.
Body text
size = Large
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Body text
size = Base
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Body text
size = Small
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Body text
size = XSmall
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Eyebrow text
Eyebrow
Eyebrow text
Heading text
Body text
Size = H1
Heading
Body text
Size = H2
Heading
Body text
Size = H3
Heading
Body text
Size = H4
Heading
Body text
Size = H5
Heading
Body text
Size = H6
Heading
Heading Lockup
The heading lockup should be used in sections that require a eyebrow, heading and sub-heading combination. The inherit variant can be used when the layout/style of a section should determine the alignment of the heading lockup.
Button
Alignment = Left
Eyebrow text
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Button
Alignment = Center
Eyebrow text
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Button
Alignment = Right
Eyebrow text
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Button
Alignment = Horizontal
Eyebrow text
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Button
Alignment = Inherit
Eyebrow text
Heading
Mollit ad ea labore aute deserunt commodo sit amet ut. Ut ad labore veniam ea. Voluptate in eu sunt excepteur duis culpa.
Scrim
The scrim component can be used to add an overlay to images or to serve as a backdrop for modals and popups.
scrim
Accordion List
Accordion List
Bento Item Wrapper
Bento Grid Cell
RTB List
RTB List