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">