Button versions new designs
Copy red code to use the button
Regular
[button class="btn btn-primary download" link="/page"]Button[/button]
[button class="btn btn-primary phone-white" link="/page"]Button[/button]
[button class="btn btn-primary" link="/page"]Button[/button]
[button class="btn btn-secondary" link="/page"]Button[/button]
[button class="btn btn-tertiary" link="/page"]Button[/button]
[button class="btn btn-link" link="/page"]Button[/button]
[button class="btn btn-primary arrow-only" link="/page"][/button]
[button class="btn btn-primary arrow-only round" link="/page"][/button]
[button class="btn btn-secondary download" link="/page"]Button[/button]
[button class="btn btn-primary external" link="/page"]Button[/button]
[button class="btn btn-primary arrow" link="/page"]Button[/button]
[button class="btn btn-secondary arrow" link="/page"]Button[/button]
[button class="btn btn-tertiary arrow" link="/page"]Button[/button]
[button class="btn btn-link arrow" link="/page"]Button[/button]
[button class="btn btn-secondary arrow-only" link="/page"][/button]
[button class="btn btn-secondary arrow-only round" link="/page"][/button]
Small
[button class="btn btn-primary btn-small" link="/page"]Button[/button]
[button class="btn btn-secondary btn-small" link="/page"]Button[/button]
[button class="btn btn-tertiary btn-small" link="/page"]Button[/button]
[button class="btn btn-primary arrow-only btn-small" link="/page"][/button]
[button class="btn btn-primary arrow btn-small" link="/page"]Button[/button]
[button class="btn btn-secondary arrow btn-small" link="/page"]Button[/button]
[button class="btn btn-tertiary arrow btn-small" link="/page"]Button[/button]
[button class="btn btn-secondary arrow-only btn-small" link="/page"][/button]
Large
[button class="btn btn-primary btn-large" link="/page"]Button[/button]
[button class="btn btn-secondary btn-large" link="/page"]Button[/button]
[button class="btn btn-tertiary btn-large" link="/page"]Button[/button]
[button class="btn btn-primary arrow-only btn-large" link="/page"][/button]
[button class="btn btn-primary arrow btn-large" link="/page"]Button[/button]
[button class="btn btn-secondary arrow btn-large" link="/page"]Button[/button]
[button class="btn btn-tertiary arrow btn-large" link="/page"]Button[/button]
[button class="btn btn-secondary arrow-only btn-small" link="/page"][/button]
Dark
[button class="btn btn-primary dark" link="/page"]Button[/button]
[button class="btn btn-secondary dark" link="/page"]Button[/button]
[button class="btn btn-tertiary dark" link="/page"]Button[/button]
[button class="btn btn-link" link="/page"]Button[/button]
[button class="btn btn-primary arrow-only dark" link="/page"][/button]
[button class="btn btn-white" link="/page"]Button[/button]
[button class="btn btn-primary arrow dark" link="/page"]Button[/button]
[button class="btn btn-secondary arrow dark" link="/page"]Button[/button]
[button class="btn btn-tertiary arrow dark" link="/page"]Button[/button]
[button class="btn btn-link arrow" link="/page"]Button[/button]
[button class="btn btn-secondary arrow-only dark" link="/page"][/button]
[button class="btn btn-white arrow" link="/page"]Button[/button]
UL available styles
Default UL
- 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.
UL with dashes (to use UL with dashe a class of “dash-list” needs to be aplied to the ul itself )
Example: <ul class="dash-list">
- 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.