Buttons
Attributes
Attribute |
Description |
Values |
Default |
size |
Define the button size |
small, medium, large, extra_large, full_width |
small |
color |
Defines the button color |
white, gray, black, accent |
N/A |
text |
Define the button text |
Text |
N/A |
text_color |
Define the button text color |
HEX or RGB value |
N/A |
font_style |
Define the button text font style |
normal, italic, oblique, initial, inherit |
normal |
font_weight |
Define the button text font weight |
normal, bold, bolder, lighter, %number |
normal |
align |
Define the button alignment (values: left, right) |
left, right |
left |
text_color |
Define the text color |
HEX value |
N/A |
text_align |
Define the text alignment |
left, right, center, justify |
left |
icon |
Define the button icon |
Available icons |
N/A |
icon_color |
Define the button icon color |
HEX or RGB value |
N/A |
margin |
Define the button fixed margin |
pixels, pt, em, % |
N/A |
link |
Define the button url |
URL |
N/A |
target |
Define the button url target |
_self, _blank |
_self |
Demo
[row bg_color=”#f2f2f2″ text_align=”center”]
[padding]
Read more
Order now
[/padding]
[/row]
[code]
[row bg_color=”#f2f2f2″ text_align=”center”]
[padding]
Read more
Order now
[/padding]
[/row]
[/code]
[spacer top=”12px” bottom=”12px”][/spacer]
[row bg_color=”#f2f2f2″ text_align=”center”]
[padding]
Extra large button.
Extra Large button
[/padding]
[/row]
[code]
[row bg_color=”#f2f2f2″ text_align=”center”]
[padding]
Extra large button.
Extra Large button
[/padding]
[/row]
[/code]
[spacer top=”12px” bottom=”12px”][/spacer]
[row bg_color=”#1c1c1e” text_color=”#fff” text_align=”center”]
[padding]
Buttons with icon.
Linux
Apple
[/padding]
[/row]
[code]
[row bg_color=”#1c1c1e” text_color=”#fff” text_align=”center”]
[padding]
Buttons with icon.
Linux
Apple
[/padding]
[/row]
[/code]
[spacer top=”12px” bottom=”12px”][/spacer]
[row bg_color=”#00a9c5″ text_color=”#fff” text_align=”center”]
[padding]
Fullwidth button.
Fullwidth button
[/padding]
[/row]
[code]
[row bg_color=”#00a9c5″ text_color=”#fff” text_align=”center”]
[padding]
Fullwidth button.
Fullwidth button
[/padding]
[/row]
[/code]