Download font
Colors
Primary hue colors
Primary 100
#EA191A
Secondary color
Secondary 100
#9FD8F4
Secondary 200
#1946BB
Secondary 300
#EAF4FE
Secondary 400
#0A215D
Neutral colors
Neutral 100
#ffffff
Neutral 200
#F5F7F9
Neutral 300
#DBE1E8
Neutral 400
#B4C1CF
Neutral 500
#8298AE
Neutral 600
#404F63
Neutral 700
#1E2833
Neutral 800
#11141A
System colors
Red 100
#ffdde1
Red 200
#ffbbc4
Red 300
#fe9aa6
Red 400
#fe566b
Blue 100
#e0edff
Blue 200
#c1dcff
Blue 300
#a2caff
Blue 400
#64a7ff
Green 100
#e3f6e6
Green 200
#c7edce
Green 300
#ace3b5
Green 400
#74d184
Yellow 100
#fcf3d5
Yellow 200
#f9e7ab
Yellow 300
#f5dc80
Yellow 400
#efc42c
Typography
Fonts
Figtree
Default
Mid
Strong
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Kk Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
Display
Text Style
Size
Line Height
Weight
Text Style
Display 10
Size:
4.5rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 9
Size:
3.75rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 8
Size:
3rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 7
Size:
2.25rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 6
Size:
1.875rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 5
Size:
1.5rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 4
Size:
1.25rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 3
Size:
1.125rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 2
Size:
1rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Display 1
Size:
0.875rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Paragraph
Text Style
Size
Line Height
Weight
Text Style
Paragraph Large - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.
Size:
1.125rem
Line Height:
1.500em
Weight:
Default
Mid
Strong
Text Style
Paragraph Default - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.
Size:
1rem
Line Height:
1.500em
Weight:
Default
Mid
Strong
Text Style
Paragraph Small - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.
Size:
0.875rem
Line Height:
1.250em
Weight:
Default
Mid
Strong
Rich text
Text Style
Size
Line Height
Weight
Text Style
Text Bold - Gravida vulputate scelerisque dui
Size:
1em
Line Height:
1.500em
Weight:
Default
Mid
Strong
Text Style
Text Link - Gravida vulputate scelerisque dui
Size:
1em
Line Height:
1.500em
Weight:
Default
Mid
Strong
Text Style
Bullet List
- Gravida vulputate scelerisque dui
- Nec purus nisl a tellus velit tellus
Size:
1em
Line Height:
1.250em
Weight:
Default
Mid
Strong
Text Style
Numbered List
- Gravida vulputate scelerisque dui
- Nec purus nisl a tellus velit tellus
Size:
1em
Line Height:
1.250em
Weight:
Default
Mid
Strong
Logo
Logo icon
Logo Full
Links
Links
Small
Default
Small
Default
Small
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Default
Lists
Primary list
Icon
Bullet
Numbers
text
Icon
Icon
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
- List item
Icons
Squared icons
Social media accent colored icons
Social media accent squared icons
Icon font
Line icons rounded
Line icons squared
Filled icons
Social media icon
Avatars
Square avatars
24px
32px
40px
48px
64px
120px
Circle avatars
24px
32px
40px
48px
64px
120px
Input
Input text
Light mode
Dark mode
Oops! Something went wrong while submitting the form.
Oops! Something went wrong while submitting the form.
Oops! Something went wrong while submitting the form.
Oops! Something went wrong while submitting the form.
Text area
Light mode
Dark mode
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Checkboxes
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Radiobuttons
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Toggle button
Placeholder
Placeholder
State messages
Error messages
Opps! Something went wrong.
We apologize, but it looks like something went wrong. We have been notified of this error and will work to resolve it as soon as possible.
Opps! Something went wrong.
We apologize, but it looks like something went wrong. We have been notified of this error and will work to resolve it as soon as possible.
Opps! Something went wrong.
We apologize, but it looks like something went wrong. We have been notified of this error and will work to resolve it as soon as possible.
Thank you message
Thank you! We’ll get back to you soon
We have received your message and will get back to you as soon as possible. Our team is dedicated to providing the best support and we appreciate your patience.
Thank you! We’ll get back to you soon
We have received your message and will get back to you as soon as possible. Our team is dedicated to providing the best support and we appreciate your patience.
Thank you! We’ll get back to you soon
We have received your message and will get back to you as soon as possible. Our team is dedicated to providing the best support and we appreciate your patience.
Thank you! We’ll get back to you soon
We have received your message and will get back to you as soon as possible. Our team is dedicated to providing the best support and we appreciate your patience.
request a demo message
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Download message
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Thank you for requesting a demo!
We have received your demo request, and one of our sales representatives will get back to you within 24 hours.
Badges
Badges
Light Mode
Dark Mode
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Badge
Rich text
Rich text
Lorem ipsum dolor.
Venenatis sollicitudin posuere elit consequat et enim. Neque tortor amet dictum tempor. Leo facilisis aliquet viverra scelerisque eleifend viverra est. At massa erat vel amet enim laoreet dictum pellentesque. Urna cursus quam pulvinar tellus. Duis fermentum nibh volutpat morbi. Et ac sed ultricies ut nunc sodales lectus. Ultricies pharetra mauris eget pellentesque accumsan tincidunt.
Donec et odio pellentes.
Et urna ac et maecenas fusce amet. Nibh nec commodo massa sed. Tincidunt porttitor in pharetra egestas sit neque ac lacus. Amet a nunc et cum. Odio at volutpat volutpat in leo eget ipsum diam elementum. Erat magna arcu orci lorem senectus orci fringilla. Tincidunt metus nisl vitae maecenas pretium aliquet. At id pharetra in vestibulum lectus pellentesque venenatis molestie.
- Morbi fringilla molestie magna sed dictum. Praesent pharetra turpis augue.
- Cras mi purus, viverra vitae felis sit amet, tincidunt fringilla lorem.
- non mattis urna ex nec sem. Donec varius diam et suscipit venenati proin tincidunt
- Quisque euismod posuere lacus sit amet volutpat. Praesent vel imperdiet
Quis faucibus massa sit egestas. Sit fermentum est ac pulvinar et sagittis sed sit ut. Quis faucibus aenean nibh vestibulum enim mi sit. Sollicitudin ultrices ultrices in ipsum urna fringilla massa leo. Sapien ultricies vitae rhoncus molestie purus. Urna urna dolor euismod porttitor et. Magna adipiscing dictum et adipiscing mollis feugiat. Est ac ultrices varius volutpat nibh purus placerat. Sapien morbi sed sit non habitant turpis dignissim. Facilisis vitae massa justo neque.
Quis faucibus massa sit egestas. Sit fermentum est ac pulvinar et sagittis sed sit ut. Quis faucibus aenean nibh vestibulum enim mi sit. Sollicitudin ultrices ultrices in ipsum urna fringilla massa leo. Sapien ultricies vitae rhoncus molestie purus. Urna urna dolor euismod porttitor et. Magna adipiscing dictum et adipiscing mollis feugiat. Est ac ultrices varius volutpat nibh purus placerat. Sapien morbi sed sit non habitant turpis dignissim. Facilisis vitae massa justo neque.
Donec et odio pellentesque.
Cursus curabitur euismod vel fermentum sapien non dolor odio vel. Tortor lectus mauris in praesent a tincidunt nam. In aenean odio aliquet pretium viverra elit quis magna. Eget ut risus posuere velit purus nisi nec sollicitudin. Tellus enim interdum neque sit vestibulum lacus. Nam pulvinar a lectus justo aliquet integer amet.
“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ”
Cursus curabitur euismod vel fermentum sapien non dolor odio vel. Tortor lectus mauris in praesent a tincidunt nam. In aenean odio aliquet pretium viverra elit quis magna. Eget ut risus posuere velit purus nisi nec sollicitudin. Tellus enim interdum neque sit vestibulum lacus. Nam pulvinar a lectus justo aliquet integer amet.
Lorem ipsum dolor sit amet consectur doler
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
- Morbi fringilla molestie magna sed dictum. Praesent pharetra turpis augue.
- Cras mi purus, viverra vitae felis sit amet, tincidunt fringilla lorem.
- non mattis urna ex nec sem. Donec varius diam et suscipit venenati proin tincidunt
- Quisque euismod posuere lacus sit amet volutpat. Praesent vel imperdiet
Dolor sit amet consectur doler
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
Sed nec maximus augue aliquam commodo sem eu nisl efficitur
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
Lorem ipsum dolor.
Venenatis sollicitudin posuere elit consequat et enim. Neque tortor amet dictum tempor. Leo facilisis aliquet viverra scelerisque eleifend viverra est. At massa erat vel amet enim laoreet dictum pellentesque. Urna cursus quam pulvinar tellus. Duis fermentum nibh volutpat morbi. Et ac sed ultricies ut nunc sodales lectus. Ultricies pharetra mauris eget pellentesque accumsan tincidunt.
Donec et odio pellentes.
Et urna ac et maecenas fusce amet. Nibh nec commodo massa sed. Tincidunt porttitor in pharetra egestas sit neque ac lacus. Amet a nunc et cum. Odio at volutpat volutpat in leo eget ipsum diam elementum. Erat magna arcu orci lorem senectus orci fringilla. Tincidunt metus nisl vitae maecenas pretium aliquet. At id pharetra in vestibulum lectus pellentesque venenatis molestie.
- Morbi fringilla molestie magna sed dictum. Praesent pharetra turpis augue.
- Cras mi purus, viverra vitae felis sit amet, tincidunt fringilla lorem.
- non mattis urna ex nec sem. Donec varius diam et suscipit venenati proin tincidunt
- Quisque euismod posuere lacus sit amet volutpat. Praesent vel imperdiet
Quis faucibus massa sit egestas. Sit fermentum est ac pulvinar et sagittis sed sit ut. Quis faucibus aenean nibh vestibulum enim mi sit. Sollicitudin ultrices ultrices in ipsum urna fringilla massa leo. Sapien ultricies vitae rhoncus molestie purus. Urna urna dolor euismod porttitor et. Magna adipiscing dictum et adipiscing mollis feugiat. Est ac ultrices varius volutpat nibh purus placerat. Sapien morbi sed sit non habitant turpis dignissim. Facilisis vitae massa justo neque.
Quis faucibus massa sit egestas. Sit fermentum est ac pulvinar et sagittis sed sit ut. Quis faucibus aenean nibh vestibulum enim mi sit. Sollicitudin ultrices ultrices in ipsum urna fringilla massa leo. Sapien ultricies vitae rhoncus molestie purus. Urna urna dolor euismod porttitor et. Magna adipiscing dictum et adipiscing mollis feugiat. Est ac ultrices varius volutpat nibh purus placerat. Sapien morbi sed sit non habitant turpis dignissim. Facilisis vitae massa justo neque.
Donec et odio pellentesque.
Cursus curabitur euismod vel fermentum sapien non dolor odio vel. Tortor lectus mauris in praesent a tincidunt nam. In aenean odio aliquet pretium viverra elit quis magna. Eget ut risus posuere velit purus nisi nec sollicitudin. Tellus enim interdum neque sit vestibulum lacus. Nam pulvinar a lectus justo aliquet integer amet.
“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ”
Cursus curabitur euismod vel fermentum sapien non dolor odio vel. Tortor lectus mauris in praesent a tincidunt nam. In aenean odio aliquet pretium viverra elit quis magna. Eget ut risus posuere velit purus nisi nec sollicitudin. Tellus enim interdum neque sit vestibulum lacus. Nam pulvinar a lectus justo aliquet integer amet.
Lorem ipsum dolor sit amet consectur doler
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
- Morbi fringilla molestie magna sed dictum. Praesent pharetra turpis augue.
- Cras mi purus, viverra vitae felis sit amet, tincidunt fringilla lorem.
- non mattis urna ex nec sem. Donec varius diam et suscipit venenati proin tincidunt
- Quisque euismod posuere lacus sit amet volutpat. Praesent vel imperdiet
Dolor sit amet consectur doler
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
Sed nec maximus augue aliquam commodo sem eu nisl efficitur
Sed non quis tellus velit orci. Quam sed mauris elementum tempor viverra. Luctus semper risus ipsum id diam praesent. Pretium eget mauris ultrices curabitur sed sem amet. Erat nulla habitant in mattis massa mi adipiscing ullamcorper condimentum. Erat quisque integer tincidunt ac amet tempor vulputate tristique. Venenatis neque odio a nulla iaculis euismod etiam.
Blockquote
“Sed id mi eget urna facilisis pharetra. Nunc viverra est at magna maximus consectetur. Sed nec maximus augue. Aliquam commodo sem eu nisl efficitur venenatis. Proin eu suscipit lorem. Nam vitae aliquet augue. Morbi rutrum ultrices lorem molestie suscipit. Sed mattis luctus odio eu porta.”
Spacing
Margin top
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Margin Bottom
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Margin left
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Margin Right
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Padding top
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Padding bottom
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Padding left
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large
Padding right
5x Extra Small
4x Extra Small
3x Extra Small
2x Extra Small
Extra Small
Small
Medium
Large
Extra Large
2x Extra Large
3x Extra Large
4x Extra Large
5x Extra Large
6x Extra Large