In CSS, we can alter the appearance of an image using various effects and filters.

<style>
    .blur {filter: blur(4px);}
    .brightness {filter: brightness(250%);}
    .contrast {filter: contrast(180%);}
    .grayscale {filter: grayscale(100%);}
    .huerotate {filter: hue-rotate(180deg);}
    .invert {filter: invert(100%);}
    .opacity {filter: opacity(50%);}
    .saturate {filter: saturate(7);}
    .sepia {filter: sepia(100%);}
    .shadow {filter: drop-shadow(8px 8px 10px green);}

    img {
        width: 20%;
        margin-right: 20px;
        margin-bottom: 20px;
    }
</style>

<img src="img.jpg" alt="Img">
<img class="blur" src="img.jpg" alt="Img">
<img class="brightness" src="img.jpg" alt="Img">
<img class="contrast" src="img.jpg" alt="Img">
<img class="grayscale" src="img.jpg" alt="Img">
<img class="huerotate" src="img.jpg" alt="Img">
<img class="invert" src="img.jpg" alt="Img">
<img class="opacity" src="img.jpg" alt="Img">
<img class="saturate" src="img.jpg" alt="Img">
<img class="sepia" src="img.jpg" alt="Img">
<img class="shadow" src="img.jpg" alt="Img">