Design for AIRadialer Hotspot
Radialer Hotspot: CSS-Button. Kopiere die Regeln oder den Prompt, der das Ergebnis nachbaut.
CSS
.btn-029 {
font: 600 15px/1 system-ui,sans-serif;
color: #fff;
background: radial-gradient(circle at 30% 30%,#fb7185,#be123c 70%);
border: 0;
border-radius: 12px;
padding: 13px 26px;
cursor: pointer;
transition: background .3s
}
.btn-029:hover {
background: radial-gradient(circle at 70% 70%,#fb7185,#be123c 70%)
}
.btn-029:focus-visible {
outline: 3px solid rgba(190,18,60,.5);
outline-offset: 2px
}
.btn-029:active {
background: #9f1239
}
HTML
<button class="btn-029">Discover</button>Prompt
Ein Rosé-Button mit radialem Verlauf: ein hellerer #fb7185 Hotspot bei 30% 30%, der bis 70% nach #be123c ausläuft. Weißer Text 15px semibold, 12px Radius, 13px mal 26px Padding. Beim Hover wandert der Hotspot auf 70% 70%; active ist flach #9f1239. Fokusring halbtransparentes Rosé.