Buttons

Clickable buttons.

Attributes

• size: set the button size (values: small, medium, large, extra_large, full_width).
• color: set the button color (values: white, gray, black, accent).
• text: set the button text.
• text_color: set the button text color.
• font_style: set the button text font style.
• font_weight: set the button text font weight.
• align: set the button alignment (values: left, right).
• icon: set the button icon if any
• icon_color: set the button icon color
• margin: set the button margin (i.e.: 12px 0 24px 0)
• link: set the button url
• target: set the button url target (values: _self, _blank)

Demo

[row bg_color="#f2f2f2" text_align="center"]
[padding]
[button size="small" color="gray" text="Read more" link="#"][/button]
[button size="small" color="accent" text="Order now" link="#"][/button]
[/padding]
[/row]

[row bg_color="#f2f2f2" text_align="center"]
[padding]
Extra large button.

[button size="extra_large" color="gray" text="Extra Large button" link="#"][/button]
[/padding]
[/row]

[row bg_color="#1c1c1e" text_color="#fff" text_align="center"]
[padding]
Buttons with icon.

[button color="white" icon="fa-linux" size="large" text="Linux" link="#"][/button]
[button color="white" icon="fa-apple" size="large" text="Apple" link="#"][/button]
[/padding]
[/row]

[row bg_color="#00a9c5" text_color="#fff" text_align="center"]
[padding]
Fullwidth button.

[button color="white" icon="fa-arrows-h" size="full_width" text="Fullwidth button" link="#"][/button]
[/padding]
[/row]