Generatore di pulsanti

Questo strumento crea un pulsante CSS a partire da testo, colori, dimensionamento, bordo, effetto hover e box-shadow opzionale, con un'anteprima interattiva in tempo reale su cui puoi passare col mouse. Restituisce una classe `.button { ... }` con una `transition: all 0.2s ease` e una regola `.button:hover` separata basata sull'effetto hover scelto (scurisci, schiarisci, solleva o nessuno).

1. Inserisci il testo del pulsante (il valore predefinito è Click Me). 2. Scegli i colori di sfondo e del testo tramite i selettori o gli input esadecimali. 3. Regola Dimensione carattere (10-32px), Padding X (8-48px), Padding Y (4-24px) e Raggio bordo (0-50px) con gli slider. 4. Imposta Colore bordo e Larghezza bordo (0-5px). 5. Scegli un Effetto hover: scurisci, schiarisci, solleva o nessuno. 6. Facoltativamente, abilita Ombra e regola Sfocatura, Offset X e Offset Y. 7. Passa col mouse sull'anteprima per vedere l'effetto; clicca Copia sulla scheda Output CSS.

Schiarisci/Scurisci regolano il colore di sfondo di +/-30 unità RGB tramite `adjustBrightness`. Solleva applica `transform: translateY(-2px)` più un `box-shadow: 0 4px 8px rgba(0,0,0,0.2)` all'hover. Nessuno omette completamente la regola hover. L'output è una singola regola `.button` contenente background-color, color, font-size, padding, border-radius, border, cursor, transition ed eventuale box-shadow, seguita dal blocco `.button:hover` quando applicabile. Non viene generato alcun HTML.