Gradiente pôr do sol

Gradiente pôr do sol: um botão em CSS. Copie as regras, ou o prompt que o reconstrói.

CSS

.btn-024 {
  font: 600 15px/1 system-ui,sans-serif;
  color: #fff;
  background: linear-gradient(135deg,#f97316,#ec4899);
  border: 0;
  border-radius: 10px;
  padding: 13px 26px;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(236,72,153,.3);
  transition: filter .15s,transform .15s,box-shadow .15s
}
.btn-024:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(236,72,153,.35)
}
.btn-024:focus-visible {
  outline: 3px solid rgba(236,72,153,.5);
  outline-offset: 2px
}
.btn-024:active {
  filter: brightness(.92);
  transform: none
}

HTML

<button class="btn-024">Get access</button>

Prompt

Um botão com gradiente a 135deg de laranja #f97316 para rosa #ec4899, texto branco de 15px semibold, raio de 10px, padding de 13px por 26px, com uma sombra de brilho rosa 0 4px 14px a 30%. No hover clareia 8%, sobe 1px e intensifica o brilho; no active escurece para 92%. Anel de foco rosa translúcido.

Gradiente pôr do sol

Mesma prateleira