Titles
Titles size can be edited in theme settings. You set the size for the H1 and then it reduces 5px per Hn
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Buttons
Primary
Secondary
Tertiary
Quaternary
Quinary
Link
Link with arrow
Forms
Field
A field is a form element containing a label and an input.
Field groups automatically receive responsive styling, swapping to one field per row on mobile devices.
Default
Disabled
focused
Error
Dropdown (selection)
A dropdown allows a user to select a value from a series of options.
Vanilla dropdown, caret and dropdown visuals will be different between browsers
Default
Disabled
focused
Error
Text Area
A textarea can be used to allow for extended user input.
Default
Disabled
focused
Error
Radio checkbox
A checkbox can be formatted as a radio element. This means it is an exclusive option.
Default
Disabled
Focused
Error
Checkbox
A checkbox allow user to select a value from a small set of options, often binary.
Default
Disabled
Focused
Error
Success
If a form is in a success state, it will automatically show any success message blocks.
Thank you!
Thanks for contacting us. We’ll get back to you as soon as possible.
Error
If a form is in a error state, it will automatically show any error message blocks.
Oops!
There is an error in the form.
Badges
Small
Large
Small rounded
Large rounded
Small
Large
Small rounded
Large rounded
Small
Large
Small rounded
Large rounded
Sale badge with custom label
Badge preset: main
Badge preset: primary
Badge preset: secondary
Badge preset: tertiary
Badge preset: success
Badge preset: warning
Badge preset: info
Badge preset: critical
Fulfillment status
Small
Large
Small rounded
Large rounded
Small
Large
Small rounded
Large rounded
Small
Large
Small rounded
Large rounded
Accordions
RICHTEXT
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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
List:
- item 1
- item 2
- item 3
- item 1
- item 2
- item 3
Icons
account
arrow-down
arrow-right
calendar
cart
facebook-outline
hamburger
instagram-outline
pinterest-outline
success
error
search
snapchat
snapchat-outline
tiktok
tiktok-outline
time
opening-quote-outline
closing-quote-outline
filled-opening-quote
filled-closing-quote
twitter-outline
tumblr
tumblr-outline
vimeo
vimeo-outline
caret up
caret down
gift
checkout
minus
plus
youtube
youtube-outline
close
map
phone
zoom-in
zoom-out
question
heart
chat
star
linkedin-outline
save
share
delete
edit
close outline
price
duration
in class
online
hybrid
business
store
textarea-grabber
youtube-play
printer
language
computer-desktop
cocktail
Swiper
Drawer
Dawer content
Dawer content