# Gradiente pôr do sol (B 024)

Categoria: Botões  
Tags: gradient, solid, rounded, warm  
Página: https://designforai.dev/pt/snippet/btn-024

## 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.

## HTML

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

## CSS

```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
}
```