Buttons are available in any color and any size. You can choose between four button styles, set dark or white content text color, choose between rounded or square corners and define whether link should open in current or new window.
[divider]
Style one
[spacer size=”25″] [column size=”1-4″] [button link=”#” color=”#9dce4a” size=”1″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”2″ style=”1″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”3″ style=”1″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”4″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f6b440″ size=”1″ style=”1″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”2″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”3″ style=”1″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”4″ style=”1″ dark=”1″ square=”1″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f5f065″ size=”1″ style=”1″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ae27d0″ size=”2″ style=”1″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#6d94b1″ size=”3″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#eb4d62″ size=”4″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″ last=”1″] [button link=”#” color=”#111″ size=”1″ style=”1″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#888″ size=”2″ style=”1″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ddd” size=”3″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#fff” size=”4″ style=”1″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [spoiler title=”Get example code”][[button link="http://www.example.com/" color="#000" size="1" style="1" dark="0" square="0" target="self"] Button text [/button]][/spoiler]
Style two
[spacer size=”25″] [column size=”1-4″] [button link=”#” color=”#9dce4a” size=”1″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”2″ style=”2″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”3″ style=”2″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”4″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f6b440″ size=”1″ style=”2″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”2″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”3″ style=”2″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”4″ style=”2″ dark=”1″ square=”1″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f5f065″ size=”1″ style=”2″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ae27d0″ size=”2″ style=”2″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#6d94b1″ size=”3″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#eb4d62″ size=”4″ style=”2″ dark=”0″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″ last=”1″] [button link=”#” color=”#111″ size=”1″ style=”2″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#888″ size=”2″ style=”2″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ddd” size=”3″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#fff” size=”4″ style=”2″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [spoiler title=”Get example code”][[button link="http://www.example.com/" color="#000" size="1" style="2" dark="0" square="0" target="self"] Button text [/button]][/spoiler]
Style three
[spacer size=”25″] [column size=”1-4″] [button link=”#” color=”#9dce4a” size=”1″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”2″ style=”3″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”3″ style=”3″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”4″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f6b440″ size=”1″ style=”3″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”2″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”3″ style=”3″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”4″ style=”3″ dark=”1″ square=”1″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f5f065″ size=”1″ style=”3″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ae27d0″ size=”2″ style=”3″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#6d94b1″ size=”3″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#eb4d62″ size=”4″ style=”3″ dark=”0″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″ last=”1″] [button link=”#” color=”#111″ size=”1″ style=”3″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#888″ size=”2″ style=”3″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ddd” size=”3″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#fff” size=”4″ style=”3″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [spoiler title=”Get example code”][[button link="http://www.example.com/" color="#000" size="1" style="3" dark="0" square="0" target="self"] Button text [/button]][/spoiler]
Style four
[spacer size=”25″] [column size=”1-4″] [button link=”#” color=”#9dce4a” size=”1″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”2″ style=”4″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”3″ style=”4″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#9dce4a” size=”4″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f6b440″ size=”1″ style=”4″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”2″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”3″ style=”4″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#f6b440″ size=”4″ style=”4″ dark=”1″ square=”1″ target=”self”]Button text[/button] [/column] [column size=”1-4″] [button link=”#” color=”#f5f065″ size=”1″ style=”4″ dark=”1″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ae27d0″ size=”2″ style=”4″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#6d94b1″ size=”3″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#eb4d62″ size=”4″ style=”4″ dark=”0″ square=”0″ target=”self”]Button text[/button] [/column] [column size=”1-4″ last=”1″] [button link=”#” color=”#111″ size=”1″ style=”4″ dark=”0″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#888″ size=”2″ style=”4″ dark=”0″ square=”1″ target=”self”]Button text[/button] [button link=”#” color=”#ddd” size=”3″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [button link=”#” color=”#fff” size=”4″ style=”4″ dark=”1″ square=”0″ target=”self”]Button text[/button] [/column] [spoiler title=”Get example code”][[button link="http://www.example.com/" color="#000" size="1" style="4" dark="0" square="0" target="self"] Button text [/button]][/spoiler] [button link=”#” color=”#9dce4a” size=”16″ style=”1″ dark=”1″ square=”0″ target=”self”] Button can be really big [/button] [spoiler title=”Get example code”]
[[button link="http://www.example.com/" color="#9dce4a" size="16" style="1" dark="1" square="0" target="self"] Button text [/button]][/spoiler]