CSS: immagini in scala di grigio con la proprietà filter

CSS: immagini in scala di grigio con la proprietà filter

Per applicare un filtro in scala di grigio alle immagini utilizzando i CSS, è possibile utilizzare la proprietà filter e il valore grayscale. Questo filtro consente di convertire l'immagine in scala di grigi, eliminando completamente la saturazione del colore.

Per applicare il filtro, basta selezionare l'elemento dell'immagine tramite il selettore CSS e assegnare la proprietà filter con il valore grayscale(100%) per convertire l'immagine completamente in scala di grigio. In alternativa, è possibile utilizzare un valore inferiore per ridurre il grado di scala di grigio applicato all'immagine.


img {
  filter: grayscale(100%);
}

In questo modo, l'immagine verrà visualizzata in scala di grigio. Questa tecnica può essere utilizzata per creare un effetto vintage o per enfatizzare le forme e i contorni dell'immagine.

Torna su