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-5b059869b4b81 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b4b81 { background-color:#ff6b6b; } .button-5b059869b4b81:hover { background-color:#ed6464; } .button-5b059869b4b81.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b4b81.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b059869b4d0f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b4d0f { background-color:#ff6b6b; } .button-5b059869b4d0f:hover { background-color:#ed6464; } .button-5b059869b4d0f.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b4d0f.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b059869b4e2c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b4e2c { background-color:#ff6b6b; } .button-5b059869b4e2c:hover { background-color:#ed6464; } .button-5b059869b4e2c.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b4e2c.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b059869b4f27 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b4f27 { background-color:#ff6b6b; } .button-5b059869b4f27:hover { background-color:#ed6464; } .button-5b059869b4f27.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b4f27.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b059869b5028 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b5028 { background-color:#ff6b6b; } .button-5b059869b5028:hover { background-color:#ed6464; } .button-5b059869b5028.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b5028.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b059869b512f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b512f { background-color:#ff6b6b; } .button-5b059869b512f:hover { background-color:#ed6464; } .button-5b059869b512f.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b059869b512f.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }

2D Buttons

.button-5b059869b6374 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b6374 { background-color:#978eb4; } .button-5b059869b6374:hover { background-color:#8c84a7; } .button-5b059869b6374.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b6374.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b059869b64d8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b64d8 { background-color:#978eb4; } .button-5b059869b64d8:hover { background-color:#8c84a7; } .button-5b059869b64d8.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b64d8.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b059869b65f0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b65f0 { background-color:#978eb4; } .button-5b059869b65f0:hover { background-color:#8c84a7; } .button-5b059869b65f0.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b65f0.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b059869b66f9 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b66f9 { background-color:#978eb4; } .button-5b059869b66f9:hover { background-color:#8c84a7; } .button-5b059869b66f9.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b66f9.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b059869b6803 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b6803 { background-color:#978eb4; } .button-5b059869b6803:hover { background-color:#8c84a7; } .button-5b059869b6803.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b6803.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b059869b68f5 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b68f5 { background-color:#978eb4; } .button-5b059869b68f5:hover { background-color:#8c84a7; } .button-5b059869b68f5.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b059869b68f5.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }

Flat Buttons

.button-5b059869b7a43 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7a43 { background-color:#57c8c3; } .mk-button.button-5b059869b7a43.flat-dimension:hover { background-color:#252525 !important; }
.button-5b059869b7b52 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7b52 { background-color:#57c8c3; } .mk-button.button-5b059869b7b52.flat-dimension:hover { background-color:#252525 !important; }
.button-5b059869b7c45 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7c45 { background-color:#57c8c3; } .mk-button.button-5b059869b7c45.flat-dimension:hover { background-color:#252525 !important; }
.button-5b059869b7cf5 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7cf5 { background-color:#57c8c3; } .mk-button.button-5b059869b7cf5.flat-dimension:hover { background-color:#252525 !important; }
.button-5b059869b7dce { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7dce { background-color:#57c8c3; } .mk-button.button-5b059869b7dce.flat-dimension:hover { background-color:#252525 !important; }
.button-5b059869b7eac { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869b7eac { background-color:#57c8c3; } .mk-button.button-5b059869b7eac.flat-dimension:hover { background-color:#252525 !important; }

Outline buttons

.button-5b059869b934c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869b9452 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869b955c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869b964b { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869b9723 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869b9816 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bab77 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bac6e { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bac6e { border-color: #71d3cf !important; color: #71d3cf; } .button-5b059869bac6e:hover { background-color:#71d3cf !important; color: #444444 !important; } .button-5b059869bac6e:hover i { color: #444444; }
.button-5b059869bad5d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bad5d { border-color: #e6d459 !important; color: #e6d459; } .button-5b059869bad5d:hover { background-color:#e6d459 !important; color: #444444 !important; } .button-5b059869bad5d:hover i { color: #444444; }
.button-5b059869bae61 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bae61 { border-color: #5adff3 !important; color: #5adff3; } .button-5b059869bae61:hover { background-color:#5adff3 !important; color: #444444 !important; } .button-5b059869bae61:hover i { color: #444444; }
.button-5b059869baf4b { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869baf4b { border-color: #b3e24e !important; color: #b3e24e; } .button-5b059869baf4b:hover { background-color:#b3e24e !important; color: #333333 !important; } .button-5b059869baf4b:hover i { color: #333333; }
.button-5b059869bb03c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bb03c { border-color: #ff6b6b !important; color: #ff6b6b; } .button-5b059869bb03c:hover { background-color:#ff6b6b !important; color: #444444 !important; } .button-5b059869bb03c:hover i { color: #444444; }
#mk-custom-box-5b059869ba606 { 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-5b059869ba606 .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-5b059869b9cf7 { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--5b059869b9cf7 { background-position:left top; background-repeat:repeat; ; } .full-width-5b059869b9cf7 .mk-fancy-title.pattern-style span, .full-width-5b059869b9cf7 .mk-blog-view-all { background-color: #555555 !important; }

Savvy buttons

.button-5b059869bc030 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bc11b { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bc206 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bc2ec { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bc3ca { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bc4a0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bd43d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b059869bd5ef { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bd5ef { border-color: #71d3cf !important; color: #71d3cf; } .button-5b059869bd5ef:after { background-color:#71d3cf; } .button-5b059869bd5ef:hover { border-color: !important; color: #444444 !important; } .button-5b059869bd5ef:hover:after { background-color:; } .button-5b059869bd5ef:hover i { color: #444444; }
.button-5b059869bd6d2 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bd6d2 { border-color: #e6d459 !important; color: #e6d459; } .button-5b059869bd6d2:after { background-color:#e6d459; } .button-5b059869bd6d2:hover { border-color: !important; color: #444444 !important; } .button-5b059869bd6d2:hover:after { background-color:; } .button-5b059869bd6d2:hover i { color: #444444; }
.button-5b059869bd7d4 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bd7d4 { border-color: #5adff3 !important; color: #5adff3; } .button-5b059869bd7d4:after { background-color:#5adff3; } .button-5b059869bd7d4:hover { border-color: !important; color: #444444 !important; } .button-5b059869bd7d4:hover:after { background-color:; } .button-5b059869bd7d4:hover i { color: #444444; }
.button-5b059869bd939 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bd939 { border-color: #b3e24e !important; color: #b3e24e; } .button-5b059869bd939:after { background-color:#b3e24e; } .button-5b059869bd939:hover { border-color: !important; color: #333333 !important; } .button-5b059869bd939:hover:after { background-color:; } .button-5b059869bd939:hover i { color: #333333; }
.button-5b059869bda46 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b059869bda46 { border-color: #ff6b6b !important; color: #ff6b6b; } .button-5b059869bda46:after { background-color:#ff6b6b; } .button-5b059869bda46:hover { border-color: !important; color: #444444 !important; } .button-5b059869bda46:hover:after { background-color:; } .button-5b059869bda46:hover i { color: #444444; }
#mk-custom-box-5b059869bcf11 { 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-5b059869bcf11 .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-5b059869bc802 { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--5b059869bc802 { background-position:left top; background-repeat:repeat; ; } .full-width-5b059869bc802 .mk-fancy-title.pattern-style span, .full-width-5b059869bc802 .mk-blog-view-all { background-color: #555555 !important; }

Full width Buttons

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

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

Not readable? Change text. captcha txt

Start typing and press Enter to search