Generatore di gradienti CSS
Crea un gradiente CSS lineare, radiale o conico con 2-8 punti colore, vedi l’anteprima e copia il CSS pronto da incollare.
- Funziona nel browser
- Nessun caricamento
- Il risultato resta sul tuo dispositivo
Privacy e limitiFunziona nel tuo browser. Nulla viene caricato.
Il contenuto degli input resta in questa scheda; Refentra non lo carica né lo memorizza. I conteggi aggregati facoltativi delle azioni vengono inviati solo con il tuo consenso alla misurazione dell’uso. Svuota l’area di lavoro al termine.
Profilo supportato: 2–8 colori HEX sRGB opachi, crescenti 0–100%; lineare/radiale/conico, anteprima e CSS.
Massimo 200.000 unità UTF-16; i parser possono avere limiti inferiori. Worker: 15 secondi (regex 1,5 secondi).
Controlla i dati e il risultato
- Prepara e scegli l’operazione
Scegli un gradiente lineare, radiale o conico; indica i colori d’arresto in ordine e un angolo adatto a quel tipo.
- Verifica un esempio concreto
Prova questo esempio e confronta il risultato indicato: linear, angle=90, colors="#000000,#ffffff", positions="0,100" → linear-gradient(90deg, #000000 0%, #ffffff 100%)
- Controlla prima di riutilizzare l’output
Copia il valore CSS generato nella dichiarazione di sfondo prevista; controlla il gradiente alla dimensione effettiva dell’elemento.
Risposte per questa operazione
Un gradiente mantiene il contrasto del testo ovunque?
No. Il contrasto cambia lungo la superficie: controlla lo sfondo più debole dietro ogni area di testo, non solo gli estremi.
Che cosa controllo se i dati vengono rifiutati?
Usa da 2 a 8 colori esadecimali opachi con posizioni degli arresti crescenti da 0 a 100; riordina gli arresti invece di affidarti alla correzione implicita del browser.
Dove si ferma questo strumento?
Genera un valore CSS per lo sfondo: non è un’immagine esportata, un gradiente animato né la prova di una resa identica su ogni schermo.