person-on-a-bridge
person-on-a-bridge

blur

0

px

brightness

0

contrast

0

%

grayscale

0

%

hue-rotate

0

deg

invert

0

%

opacity

0

%

saturate

0

%

sepia

0

%

filter: blur(8.5px) brightness(1.578) contrast(431%) grayscale(83%) hue-rotate(297deg) invert(0%) opacity(0%) saturate(0%) sepia(22%);

A little about this project

For a long time, I was struggling to style images quickly using CSS Filters and I had to spend a lot of time in dev tools to get the perfect styling to an image. Then I was inspired by a great tool for designing our hero sections by Sarah. I thought, why not built a tool for using css filters as well!

You can toggle any filter to add it and change the values with the slider and import the code to your project.