Generatore di filtri CSS
Costruisci una dichiarazione CSS filter o backdrop-filter da controlli visivi.
Generatore di filtri CSS
Questo strumento crea una dichiarazione CSS filter (o backdrop-filter) pronta per incollare da un set di controlli visivi, così non devi ricordare la sintassi per combinare sfocatura, luminosità, contrasto, scala di grigi, rotazione tonalità, invertire, opacità, saturazione, seppia e ombra sfocata in una proprietà. È destinato a chiunque stili una galleria fotografica, un effetto hover, un pannello con effetto vetro smerigliato o un trattamento immagine a tema senza scrivere manualmente l'elenco delle funzioni di filtro.
Ogni funzione ha il suo campo, e il valore generato elenca solo quelle che hai effettivamente modificato — quindi una pagina con solo una piccola sfocatura rimane breve invece di elencare nove funzioni senza effetto. Il campo dell'ordine delle funzioni controlla l'ordine in cui vengono eseguite, poiché i filtri CSS si applicano da sinistra a destra e riordinarli (sfocatura prima o dopo la regolazione del contrasto, ad esempio) può modificare il risultato visivo. Due predefiniti, vintage e bianco e nero, impostano un intero gruppo di valori contemporaneamente per un aspetto comune. Attiva "backdrop-filter" per filtrare ciò che si trova dietro un elemento invece dell'elemento stesso — la scelta standard per i pannelli glassmorphism — e cambia il formato di output per ottenere una classe di valore arbitrario Tailwind invece di una semplice riga CSS.
I campi numerici vengono automaticamente limitati a intervalli ragionevoli, quindi un valore accidentalmente enorme o negativo non rompe mai l'output; il campo di colore dell'ombra sfocata accetta qualsiasi valore di colore CSS. Il risultato si aggiorna in tempo reale mentre regoli qualsiasi opzione, e il conteggio sopra l'output conta quante funzioni sono effettivamente attive.
Tutto viene eseguito localmente nel tuo browser — nulla di ciò che inserisci qui viene caricato o inviato da nessuna parte. Copia il risultato, scaricalo come file .txt o invialo all'input di un altro strumento per continuare a lavorarci.