⭐ 0
🔍
Testo Immagine PDF e Documenti Audio Musica Elettronica Tempo Utilità Validatori Esoterismo Giochi

Generatore di gradienti radiali CSS

Crea visivamente gradienti CSS: tipo lineare, radiale o conico, dispositivo di scorrimento angolare e fino a sei interruzioni di colore con un'anteprima live a larghezza intera e codice copiabile.

90°
Elaborazione... 0%

Risultato

Questa pagina apre il generatore di gradienti con il tipo radiale già selezionato: i colori si irradiano verso l'esterno dal centro dell'elemento in cerchi concentrici e ogni punto modificato ridisegna immediatamente l'anteprima.

radial-gradient() è lo strumento per effetti di luce e riflettori, vignette morbide e sfondi che necessitano di un punto focale anziché di una direzione. Le posizioni degli stop in percentuale corrispondono alla distanza dal centro - 0% è il centro, 100% il bordo più lontano - quindi stringendo i primi stop si crea un piccolo nucleo luminoso, allargandoli si ottiene un ampio lavaggio.

Copia la linea di sfondo una volta che l'anteprima appare corretta. Il cursore dell'angolo è nascosto in questa modalità perché un cerchio non ha direzione: torna a lineare o conico e riappare.

🛡️
Eseguito nel browser

I tuoi file e input non lasciano mai questo dispositivo. L'elaborazione viene eseguita completamente offline. Sicuro al 100%.

Formati e regole accettati

  • Selezione del tipo di gradiente (lineare, radiale, conico) con un cursore angolare per le modalità lineare e conica.
  • Elenco fermate colore: due fermate per iniziare, aggiungi o rimuovi fino a sei, ciascuna con il proprio selettore di colori e posizione in percentuale.
  • Linea CSS di sfondo copiabile più pagine preimpostate già pronte per sfumature tramonto, oceano e pastello.

Vantaggi principali

✓ L'anteprima a larghezza intera viene ridisegnata a ogni modifica (tipo, angolo e ogni interruzione di colore) in modo che il CSS che copi sia esattamente quello che hai visto.
✓ Fino a sei interruzioni di colore con posizioni individuali coprono qualsiasi cosa, da una semplice dissolvenza a due colori a complessi sfondi multi-banda.
✓ Una dichiarazione, tre motori: passa da lineare, radiale a conico senza ricostruire le fermate.

Casi d'uso

  • • Componi uno sfondo con sezione eroe trascinando gli angoli e i punti di colore invece di modificare manualmente linear-gradient() e ricaricando.
  • • Confronta le stesse interruzioni di colore dei gradienti lineari, radiali e conici con un solo interruttore: le interruzioni vengono trasferite tra i tipi.
  • • Prendi una combinazione collaudata dalla pagina delle preimpostazioni tramonto, oceano o pastello e modificala con i colori del tuo marchio.