blur(1px) blur(1px)

Chris Coyier Chris Coyier on

I know that you can “chain” the CSS property filter, like:

.element {
  filter: blur(2px) grayscale(80%) contrast(200%);
}Code language: CSS (css)

All three of those filters will apply. But somehow I never thought about applying the same filter more than once. That also works, and they don’t override each other, they “stack” (or whatever you want to call it).

So here’s some useless bar trivia for you. What is blurrier, filter: blur(2px) or filter: blur(1px) blur(1px)? Answer.

Wanna be a better web typographer?

Frontend Masters logo

It was once famously said that the web is 95% typography. You can't be a web designer and ignore type! We have an in-depth course on web typography from Jason Pamental getting into things like responsive styles, variable fonts, font loading, and more.

7-Day Free Trial

Leave a Reply

Your email address will not be published. Required fields are marked *

Did you know?

Frontend Masters Donates to open source projects. $363,806 contributed to date.