ItalianoIT

Generatore di filtri CSS – sfocatura, luminosità, scala di grigi

Sposta i cursori: anteprima e codice del filtro si aggiornano insieme.

Testi e file restano nel tuo browser: non viene inviato nulla a un server.

Trascina qui un file o fai clic per sceglierlo
Codice CSS

Come si usa

  1. È già caricata un’immagine di esempio. Per usare la tua, trascinala nell’area qui sotto.
  2. Sposta un cursore o scegli una preimpostazione: l’effetto si applica subito. Le regolazioni lasciate al valore predefinito non compaiono nel codice.
  3. Tieni premuto il pulsante a forma di occhio per confrontare con l’immagine senza filtro.
  4. Copia il codice CSS oppure, nei browser compatibili, salva con “Scarica” un PNG con il filtro applicato.

Domande frequenti

L’ordine delle funzioni di filtro conta?

Sì. I filtri si applicano da sinistra a destra, quindi un ordine diverso dà un risultato diverso. Questo strumento li scrive sempre nello stesso ordine.

Che differenza c’è tra drop-shadow e box-shadow?

box-shadow disegna un’ombra attorno al riquadro rettangolare dell’elemento, mentre drop-shadow segue la forma davvero visibile e ignora le zone trasparenti. È ideale per PNG trasparenti e icone.

Perché non c’è il pulsante “Scarica”?

È nascosto nei browser che non supportano i filtri su canvas, come alcune versioni di Safari. Puoi comunque copiare e usare il codice CSS.

Strumenti simili

Gradiente CSSGradienti lineari, radiali, coniciFoto in bianco e neroGrigi, seppia e negativoConvertitore di immaginiConverti JPG, PNG e WebPGeneratore di ASCII artTesto e foto in caratteri

Tutti gli strumenti