按钮 · Dry Panther

类型：组件　·　分类：按钮　·　收录：2026-09-19　·　源码：会员可见

[hidecontent type="vip1"]

<button>
  <span> HOVER
  </span>
</button>
<style>
/* From Uiverse.io by Yashwanthnaini - Tags: button */
button {
 border: none;
 border-radius: 20px;
 background: linear-gradient(32deg,#03a9f4,#f441a5,#ffeb3b,#03a9f4);
 transition: all 1.5s ease;
 font-family: 'Ropa Sans', sans-serif;
 font-weight: bold;
 letter-spacing: 0.05rem;
 padding: 0;
}

button span {
 display: inline-block;
 padding: 15px 35px;
 font-size: 17px;
 border-radius: 20px;
 background: #ffffff10;
 backdrop-filter: blur(20px);
 transition: 0.4s ease-in-out;
 transition-property: color;
 height: 100%;
 width: 100%;
}

button span:hover {
 backdrop-filter: blur(0px);
 color: #ffffff;
}
</style>

[/hidecontent]