Buttons

[spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Standard Square Buttons

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»standard» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»accent» type=»standard» size=»medium» link=»#» target=»_self]Medium button[/button] [button colour=»accent» type=»standard» size=»large» link=»#» target=»_self]Large button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»standard» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»standard» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»standard» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Square Buttons with arrows

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»squarearrow» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»accent» type=»squarearrow» size=»medium» link=»#» target=»_self]Medium button[/button] [button colour=»accent» type=»squarearrow» size=»large» link=»#» target=»_self]Large button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»squarearrow» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»squarearrow» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»squarearrow» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Slightly Rounded Buttons

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»slightlyrounded» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»accent» type=»slightlyrounded» size=»medium» link=»#» target=»_self]Medium button[/button] [button colour=»accent» type=»slightlyrounded» size=»large» link=»#» target=»_self]Large button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»slightlyrounded» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»slightlyrounded» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»slightlyrounded» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Slightly Rounded Buttons with arrows

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»accent» type=»slightlyroundedarrow» size=»medium» link=»#» target=»_self]Medium button[/button] [button colour=»accent» type=»slightlyroundedarrow» size=»large» link=»#» target=»_self]Large button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»slightlyroundedarrow» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»slightlyroundedarrow» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Rounded Buttons

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»rounded» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»accent» type=»rounded» size=»medium» link=»#» target=»_self]Medium button[/button] [button colour=»accent» type=»rounded» size=»large» link=»#» target=»_self]Large button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»rounded» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»rounded» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»rounded» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Rounded Buttons with arrows

[/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»first last»] [[button colour=»accent» type=»roundedarrow» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»accent» type=»roundedarrow» size=»medium» link=»#» target=»_self]Medium button[/button]] [[button colour=»accent» type=»roundedarrow» size=»large» link=»#» target=»_self]Large button[/button]] [/codesnippet] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Coloured Buttons with arrows

[/spb_text_block] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/1″ el_position=»first last»] [button colour=»black» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small Button[/button] [button colour=»grey» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»lightgrey» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»purple» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»lightblue» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»turquoise» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»green» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»limegreen» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»orange» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [button colour=»pink» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»1/1″ el_position=»first last»] [[button colour=»black» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small Button[/button]] [[button colour=»grey» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»lightgrey» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»purple» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»lightblue» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»turquoise» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»green» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»limegreen» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»orange» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [[button colour=»pink» type=»slightlyroundedarrow» size=»small» link=»#» target=»_self]Small button[/button]] [/codesnippet] [blank_spacer height=»20px» width=»1/1″ el_position=»first last»] [divider type=»dotted» text=»Go to top» full_width=»no» width=»1/1″ el_position=»first last»] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/1″ el_position=»first last»]

Button effects

[/spb_text_block] [spb_text_block pb_margin_bottom=»no» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»outerglow» size=»small» link=»#» target=»_self]Outer Glow Effect Button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»outerglow» size=»small» link=»#» target=»_self]Outer Glow Effect Button[/button]] [/codesnippet] [spb_text_block pb_margin_bottom=»yes» pb_border_bottom=»no» width=»1/3″ el_position=»first»] [button colour=»accent» type=»dropshadow» size=»small» link=»#» target=»_self]Drop Shadow Effect Button[/button] [/spb_text_block] [codesnippet pb_margin_bottom=»yes» width=»2/3″ el_position=»last»] [[button colour=»accent» type=»dropshadow» size=»small» link=»#» target=»_self]Drop Shadow Effect Button[/button]] [/codesnippet] [blank_spacer height=»50px» width=»1/1″ el_position=»first last»]