Rental Branding
Headers
H1
The quick, brown fox jumps over the lazy dog
H2
The quick, brown fox jumps over the lazy dog
H3
The quick, brown fox jumps over the lazy dog
H4
The quick, brown fox jumps over the lazy dog
H5
The quick, brown fox jumps over the lazy dog
H6
The quick, brown fox jumps over the lazy dog
Font sizes
paragraph-extra-large
The quick, brown fox jumps over the lazy dog
paragraph-large
The quick, brown fox jumps over the lazy dog
paragraph-regular
The quick, brown fox jumps over the lazy dog
paragraph-small
The quick, brown fox jumps over the lazy dog
paragraph-extra-small
The quick, brown fox jumps over the lazy dog
Colors
Primary blue
Neon yellow
Black
Gray 700
Gray 500
Gray 300
Gray 200
Gray 100
White
White Opacity 90
White Opacity 60
White Opacity 30
White Opacity 15
Bright blue
Green
Yellow
Orange
Red
Paddings
Padding 1 - Class : p-24-30
Padding 2 - Class : p-20-30
Buttons
Text links
Text link 1
Lorem ipsumText link 2
Lorem ipsumText link 3
Lorem ipsumText fields
Input text
Input text - disabled
Input text - error
Textarea
Default
Checkbox
Large
Large - Error
Small
Small - Error
Radiobuttons
Large
Large - Error
Small
Small - Error
Accordions
Large
This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
Small
This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
.accordion-body
, though the transition does limit overflow.
Icons