This article will review how to create an old photo effect on any picture using only CSS. No need for Photoshop or any other image editor. And all in just a few lines of code!
We will check three different methods that build on top of each other, increasing the old photo effect with each iteration to make it look more realistic and nicer.
For the examples on this page, we will use a photograph by Filipp Romanovski. You can find it on Unsplash, along with many other amazing pictures (by Filipp and many more authors.)
Using an Image Tag
The most basic way of creating the old photo effect is directly applying filters to an image in the <img /> tag. This method is quick, and the effect will be nice, but the result may be too basic.