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

Generatore di gradienti conici 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 conico già selezionato: invece di sfumare lungo una linea o fuori dal centro, i colori si spostano attorno al centro come una lancetta di un orologio, a partire dall'angolo impostato sullo slider.

conic-gradient() è la più recente delle tre funzioni gradiente CSS e quella alla base dei grafici a torta, delle ruote dei colori e degli accattivanti effetti di bordo rotante. Le posizioni di arresto in percentuale sono posizioni attorno al cerchio: due arresti allo 0% e al 100% si fondono uniformemente tutto intorno, mentre gli arresti posizionati vicini creano cunei netti.

Regola l'angolo iniziale e si ferma finché l'anteprima non viene visualizzata correttamente, quindi copia la linea di sfondo. Tutti i browser moderni supportano i gradienti conici, quindi il codice è sicuro da spedire.

🛡️
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.