乐享3D | JoysMaker 3D打印机 | 3D打印 – Buttons

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-5b727a52e67c8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e67c8 { background-color:#ff6b6b; } .button-5b727a52e67c8:hover { background-color:#ed6464; } .button-5b727a52e67c8.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e67c8.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b727a52e6977 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e6977 { background-color:#ff6b6b; } .button-5b727a52e6977:hover { background-color:#ed6464; } .button-5b727a52e6977.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e6977.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b727a52e6af3 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e6af3 { background-color:#ff6b6b; } .button-5b727a52e6af3:hover { background-color:#ed6464; } .button-5b727a52e6af3.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e6af3.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b727a52e6c36 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e6c36 { background-color:#ff6b6b; } .button-5b727a52e6c36:hover { background-color:#ed6464; } .button-5b727a52e6c36.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e6c36.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b727a52e6d6f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e6d6f { background-color:#ff6b6b; } .button-5b727a52e6d6f:hover { background-color:#ed6464; } .button-5b727a52e6d6f.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e6d6f.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }
.button-5b727a52e6ebc { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e6ebc { background-color:#ff6b6b; } .button-5b727a52e6ebc:hover { background-color:#ed6464; } .button-5b727a52e6ebc.three-dimension { box-shadow: 0px 3px 0px 0px #cc5656; } .button-5b727a52e6ebc.three-dimension:active { box-shadow: 0px 1px 0px 0px #cc5656; }

2D Buttons

.button-5b727a52e8480 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e8480 { background-color:#978eb4; } .button-5b727a52e8480:hover { background-color:#8c84a7; } .button-5b727a52e8480.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e8480.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b727a52e85f0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e85f0 { background-color:#978eb4; } .button-5b727a52e85f0:hover { background-color:#8c84a7; } .button-5b727a52e85f0.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e85f0.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b727a52e876f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e876f { background-color:#978eb4; } .button-5b727a52e876f:hover { background-color:#8c84a7; } .button-5b727a52e876f.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e876f.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b727a52e88ed { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e88ed { background-color:#978eb4; } .button-5b727a52e88ed:hover { background-color:#8c84a7; } .button-5b727a52e88ed.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e88ed.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b727a52e8a7c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e8a7c { background-color:#978eb4; } .button-5b727a52e8a7c:hover { background-color:#8c84a7; } .button-5b727a52e8a7c.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e8a7c.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }
.button-5b727a52e8bf9 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52e8bf9 { background-color:#978eb4; } .button-5b727a52e8bf9:hover { background-color:#8c84a7; } .button-5b727a52e8bf9.three-dimension { box-shadow: 0px 3px 0px 0px #797290; } .button-5b727a52e8bf9.three-dimension:active { box-shadow: 0px 1px 0px 0px #797290; }

Flat Buttons

.button-5b727a52ea409 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ea409 { background-color:#57c8c3; } .mk-button.button-5b727a52ea409.flat-dimension:hover { background-color:#252525 !important; }
.button-5b727a52ea57e { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ea57e { background-color:#57c8c3; } .mk-button.button-5b727a52ea57e.flat-dimension:hover { background-color:#252525 !important; }
.button-5b727a52ea6d5 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ea6d5 { background-color:#57c8c3; } .mk-button.button-5b727a52ea6d5.flat-dimension:hover { background-color:#252525 !important; }
.button-5b727a52ea82f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ea82f { background-color:#57c8c3; } .mk-button.button-5b727a52ea82f.flat-dimension:hover { background-color:#252525 !important; }
.button-5b727a52ea99d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ea99d { background-color:#57c8c3; } .mk-button.button-5b727a52ea99d.flat-dimension:hover { background-color:#252525 !important; }
.button-5b727a52eaafe { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52eaafe { background-color:#57c8c3; } .mk-button.button-5b727a52eaafe.flat-dimension:hover { background-color:#252525 !important; }

Outline buttons

.button-5b727a52ec302 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ec43d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ec59d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ec706 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ec848 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ec9b9 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ee203 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52ee352 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ee352 { border-color: #71d3cf !important; color: #71d3cf; } .button-5b727a52ee352:hover { background-color:#71d3cf !important; color: #444444 !important; } .button-5b727a52ee352:hover i { color: #444444; }
.button-5b727a52ee4d7 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ee4d7 { border-color: #e6d459 !important; color: #e6d459; } .button-5b727a52ee4d7:hover { background-color:#e6d459 !important; color: #444444 !important; } .button-5b727a52ee4d7:hover i { color: #444444; }
.button-5b727a52ee640 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ee640 { border-color: #5adff3 !important; color: #5adff3; } .button-5b727a52ee640:hover { background-color:#5adff3 !important; color: #444444 !important; } .button-5b727a52ee640:hover i { color: #444444; }
.button-5b727a52ee798 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ee798 { border-color: #b3e24e !important; color: #b3e24e; } .button-5b727a52ee798:hover { background-color:#b3e24e !important; color: #333333 !important; } .button-5b727a52ee798:hover i { color: #333333; }
.button-5b727a52ee8f0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52ee8f0 { border-color: #ff6b6b !important; color: #ff6b6b; } .button-5b727a52ee8f0:hover { background-color:#ff6b6b !important; color: #444444 !important; } .button-5b727a52ee8f0:hover i { color: #444444; }
#mk-custom-box-5b727a52eda84 { 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-5b727a52eda84 .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-5b727a52ecf9c { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--5b727a52ecf9c { background-position:left top; background-repeat:repeat; ; } .full-width-5b727a52ecf9c .mk-fancy-title.pattern-style span, .full-width-5b727a52ecf9c .mk-blog-view-all { background-color: #555555 !important; }

Savvy buttons

.button-5b727a52f00c0 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f021c { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f037d { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f04c8 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f0619 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f077f { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f1cd4 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; }
.button-5b727a52f1e12 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52f1e12 { border-color: #71d3cf !important; color: #71d3cf; } .button-5b727a52f1e12:after { background-color:#71d3cf; } .button-5b727a52f1e12:hover { border-color: !important; color: #444444 !important; } .button-5b727a52f1e12:hover:after { background-color:; } .button-5b727a52f1e12:hover i { color: #444444; }
.button-5b727a52f1f98 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52f1f98 { border-color: #e6d459 !important; color: #e6d459; } .button-5b727a52f1f98:after { background-color:#e6d459; } .button-5b727a52f1f98:hover { border-color: !important; color: #444444 !important; } .button-5b727a52f1f98:hover:after { background-color:; } .button-5b727a52f1f98:hover i { color: #444444; }
.button-5b727a52f2105 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52f2105 { border-color: #5adff3 !important; color: #5adff3; } .button-5b727a52f2105:after { background-color:#5adff3; } .button-5b727a52f2105:hover { border-color: !important; color: #444444 !important; } .button-5b727a52f2105:hover:after { background-color:; } .button-5b727a52f2105:hover i { color: #444444; }
.button-5b727a52f2289 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52f2289 { border-color: #b3e24e !important; color: #b3e24e; } .button-5b727a52f2289:after { background-color:#b3e24e; } .button-5b727a52f2289:hover { border-color: !important; color: #333333 !important; } .button-5b727a52f2289:hover:after { background-color:; } .button-5b727a52f2289:hover i { color: #333333; }
.button-5b727a52f23f1 { margin-bottom: 15px; margin-top: 0px; min-width: 0px !important; } .button-5b727a52f23f1 { border-color: #ff6b6b !important; color: #ff6b6b; } .button-5b727a52f23f1:after { background-color:#ff6b6b; } .button-5b727a52f23f1:hover { border-color: !important; color: #444444 !important; } .button-5b727a52f23f1:hover:after { background-color:; } .button-5b727a52f23f1:hover i { color: #444444; }
#mk-custom-box-5b727a52f1609 { 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-5b727a52f1609 .mk-fancy-title.pattern-style span{ background-color: #555555 !important; }
.full-width-5b727a52f0bd0 { min-height:100px; padding:50px 0 40px; margin-bottom:0px; background-color:#555555; } #background-layer--5b727a52f0bd0 { background-position:left top; background-repeat:repeat; ; } .full-width-5b727a52f0bd0 .mk-fancy-title.pattern-style span, .full-width-5b727a52f0bd0 .mk-blog-view-all { background-color: #555555 !important; }

Full width Buttons

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

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

Not readable? Change text. captcha txt

Start typing and press Enter to search