Buttons

5 customisable buttons

Choose between 5 beautiful and animated button styles with customise features such as corner radius and button hover color.

3D Buttons

.button-59506b28238bd { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28238bd { background-color:#ff6b6b; } .button-59506b28238bd:hover { background-color:#ed6464; } .button-59506b28238bd.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b28238bd.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-59506b2823aff { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2823aff { background-color:#ff6b6b; } .button-59506b2823aff:hover { background-color:#ed6464; } .button-59506b2823aff.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b2823aff.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-59506b2823cef { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2823cef { background-color:#ff6b6b; } .button-59506b2823cef:hover { background-color:#ed6464; } .button-59506b2823cef.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b2823cef.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-59506b2823eff { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2823eff { background-color:#ff6b6b; } .button-59506b2823eff:hover { background-color:#ed6464; } .button-59506b2823eff.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b2823eff.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-59506b28240fc { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28240fc { background-color:#ff6b6b; } .button-59506b28240fc:hover { background-color:#ed6464; } .button-59506b28240fc.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b28240fc.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-59506b2824347 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2824347 { background-color:#ff6b6b; } .button-59506b2824347:hover { background-color:#ed6464; } .button-59506b2824347.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b2824347.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }

2D Buttons

.button-59506b2825915 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2825915 { background-color:#978eb4; } .button-59506b2825915:hover { background-color:#8c84a7; } .button-59506b2825915.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b2825915.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-59506b2825b41 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2825b41 { background-color:#978eb4; } .button-59506b2825b41:hover { background-color:#8c84a7; } .button-59506b2825b41.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b2825b41.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-59506b2825d71 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2825d71 { background-color:#978eb4; } .button-59506b2825d71:hover { background-color:#8c84a7; } .button-59506b2825d71.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b2825d71.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-59506b2825f6d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2825f6d { background-color:#978eb4; } .button-59506b2825f6d:hover { background-color:#8c84a7; } .button-59506b2825f6d.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b2825f6d.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-59506b2826191 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2826191 { background-color:#978eb4; } .button-59506b2826191:hover { background-color:#8c84a7; } .button-59506b2826191.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b2826191.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-59506b28263cd { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28263cd { background-color:#978eb4; } .button-59506b28263cd:hover { background-color:#8c84a7; } .button-59506b28263cd.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-59506b28263cd.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }

Flat Buttons

.button-59506b2827dfd { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2827dfd { background-color:#57c8c3; } .mk-button.button-59506b2827dfd.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b2828037 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2828037 { background-color:#57c8c3; } .mk-button.button-59506b2828037.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b2828235 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2828235 { background-color:#57c8c3; } .mk-button.button-59506b2828235.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b2828475 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2828475 { background-color:#57c8c3; } .mk-button.button-59506b2828475.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b2828799 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2828799 { background-color:#57c8c3; } .mk-button.button-59506b2828799.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b2828a01 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2828a01 { background-color:#57c8c3; } .mk-button.button-59506b2828a01.flat-dimension:hover { background-color:#252525 !important; }

Outline buttons

.button-59506b282a1ec { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282a417 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282a5f8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282a823 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282aa03 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282ac1d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282c4f8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282c7b6 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b282c7b6 { border-color: #71d3cf !important; color: #71d3cf; } .button-59506b282c7b6:hover { background-color:#71d3cf !important; color: #444444 !important; } .button-59506b282c7b6:hover i { color: #444444; }
.button-59506b282cac0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b282cac0 { border-color: #e6d459 !important; color: #e6d459; } .button-59506b282cac0:hover { background-color:#e6d459 !important; color: #444444 !important; } .button-59506b282cac0:hover i { color: #444444; }
.button-59506b282cdb3 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b282cdb3 { border-color: #5adff3 !important; color: #5adff3; } .button-59506b282cdb3:hover { background-color:#5adff3 !important; color: #444444 !important; } .button-59506b282cdb3:hover i { color: #444444; }
.button-59506b282d0f1 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b282d0f1 { border-color: #b3e24e !important; color: #b3e24e; } .button-59506b282d0f1:hover { background-color:#b3e24e !important; color: #333333 !important; } .button-59506b282d0f1:hover i { color: #333333; }
.button-59506b282d3fe { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b282d3fe { border-color: #ff6b6b !important; color: #ff6b6b; } .button-59506b282d3fe:hover { background-color:#ff6b6b !important; color: #444444 !important; } .button-59506b282d3fe:hover i { color: #444444; }
#mk-custom-box-59506b282be62 { min-height:100px; padding:40px 40px; background-attachment:scroll; background-repeat:repeat; background-color:#555555; background-position:left top; margin-bottom:0px; } #mk-custom-box-59506b282be62 .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-59506b282b431 { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--59506b282b431 { background-position:left top; background-repeat:repeat; ; } .full-width-59506b282b431 .mk-fancy-title.pattern-style span, .full-width-59506b282b431 .mk-blog-view-all { background-color: #555555 !important; }

Savvy buttons

.button-59506b282e9a5 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282ec88 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282eef4 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282f129 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282f44d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b282f742 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b2831091 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-59506b2831276 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2831276 { border-color: #71d3cf !important; color: #71d3cf; } .button-59506b2831276:after { background-color:#71d3cf; } .button-59506b2831276:hover { border-color: !important; color: #444444 !important; } .button-59506b2831276:hover:after { background-color:; } .button-59506b2831276:hover i { color: #444444; }
.button-59506b28314bc { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28314bc { border-color: #e6d459 !important; color: #e6d459; } .button-59506b28314bc:after { background-color:#e6d459; } .button-59506b28314bc:hover { border-color: !important; color: #444444 !important; } .button-59506b28314bc:hover:after { background-color:; } .button-59506b28314bc:hover i { color: #444444; }
.button-59506b28316c8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28316c8 { border-color: #5adff3 !important; color: #5adff3; } .button-59506b28316c8:after { background-color:#5adff3; } .button-59506b28316c8:hover { border-color: !important; color: #444444 !important; } .button-59506b28316c8:hover:after { background-color:; } .button-59506b28316c8:hover i { color: #444444; }
.button-59506b28318c4 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28318c4 { border-color: #b3e24e !important; color: #b3e24e; } .button-59506b28318c4:after { background-color:#b3e24e; } .button-59506b28318c4:hover { border-color: !important; color: #333333 !important; } .button-59506b28318c4:hover:after { background-color:; } .button-59506b28318c4:hover i { color: #333333; }
.button-59506b2831ac7 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b2831ac7 { border-color: #ff6b6b !important; color: #ff6b6b; } .button-59506b2831ac7:after { background-color:#ff6b6b; } .button-59506b2831ac7:hover { border-color: !important; color: #444444 !important; } .button-59506b2831ac7:hover:after { background-color:; } .button-59506b2831ac7:hover i { color: #444444; }
#mk-custom-box-59506b2830a0a { min-height:100px; padding:40px 40px; background-attachment:scroll; background-repeat:repeat; background-color:#555555; background-position:left top; margin-bottom:0px; } #mk-custom-box-59506b2830a0a .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-59506b28300e5 { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--59506b28300e5 { background-position:left top; background-repeat:repeat; ; } .full-width-59506b28300e5 .mk-fancy-title.pattern-style span, .full-width-59506b28300e5 .mk-blog-view-all { background-color: #555555 !important; }

Full width Buttons

.button-59506b28330c7 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28330c7 { border-color: #2c7fb1 !important; color: #2c7fb1; } .button-59506b28330c7:hover { background-color:#2c7fb1 !important; color: #ffffff !important; } .button-59506b28330c7:hover i { color: #ffffff; }
.button-59506b28332c0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28332c0 { background-color:#57c8c3; } .mk-button.button-59506b28332c0.flat-dimension:hover { background-color:#252525 !important; }
.button-59506b28334f1 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-59506b28334f1 { background-color:#ff6b6b; } .button-59506b28334f1:hover { background-color:#ed6464; } .button-59506b28334f1.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-59506b28334f1.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
联系我们

我们期待听到您的声音,有任何疑问,请直接填写后发送给我们,我将尽快于您取得联系。谢谢您的关注!

Not readable? Change text. captcha txt

Start typing and press Enter to search