پیش‌نمایش زنده
کد HTML
<button>
  <span>Button<span> </span></span>
</button>
کد CSS
button {
  background: linear-gradient(245deg, #000000 0%, #fdff96 100%),
    linear-gradient(245deg, #0038ff 0%, #000000 100%),
    radial-gradient(100% 225% at 100% 0%, #4200ff 0%, #001169 100%),
    linear-gradient(245deg, #000000 0%, #ffb800 100%),
    radial-gradient(
      115% 107% at 40% 100%,
      #eaf5ff 0%,
      #eaf5ff 40%,
      #a9c6de calc(40% + 1px),
      #a9c6de 70%,
      #247e6c calc(70% + 2px),
      #247e6c 85%,
      #e4c666 calc(85% + 2px),
      #e4c666 100%
    ),
    linear-gradient(
      65deg,
      #083836 0%,
      #083836 40%,
      #66d37e calc(40% + 1px),
      #66d37e 60%,
      #c6e872 calc(60% + 1px),
      #c6e872 100%
    );
  background-blend-mode: overlay, screen, overlay, hard-light, overlay, normal;
  font-family: inherit;
  padding: 0.6em 1.3em;
  font-weight: 900;
  font-size: 18px;
  border: 3px solid black;
  border-radius: 0.4em;
  box-shadow: 0.1em 0.1em;
}

button > span {
  color: white;
}

button:hover {
  transform: translate(-0.05em, -0.05em);
  box-shadow: 0.15em 0.15em;
}

button:active {
  transform: translate(0.05em, 0.05em);
  box-shadow: 0.05em 0.05em;
}
نوع: button
تاریخ ایجاد: 2026/06/05
آخرین بروزرسانی: 2026/06/05