CSS3 Image Filter Effects

grayscale

Photo by: Mehdi Kh

Codes

img {
  -webkit-filter: grayscale(100%);
}

Sepia

Photo by: Mehdi Kh

Codes

      img {
      -webkit-filter: sepia(100%);
      } 

Brightness

Photo by: Mehdi Kh

Codes

img {
  -webkit-filter: brightness(50%);
}

Contrast

Photo by: Mehdi Kh

Codes

img {
  -webkit-filter: contrast(200%);
}

Gaussian Blur

Photo by: Mehdi Kh

Codes

img {
  -webkit-filter: blur(10px);
}