Re: [css-images][css-compositing] Blurring an element’s backdrop

On Thu, Nov 28, 2013 at 10:35 PM, Lea Verou <lea@verou.me> wrote:

> On Nov 29, 2013, at 12:45, Rik Cabanier <cabanier@gmail.com> wrote:
> > This might work.
> > My main concern is that it would overload mix-blend-mode too much since
> we're also hoping to repurpose it to blend different areas of an element.
> I'm unsure how we would reconcile that.
> > Do you have a suggestion?
>
> If the syntax for that is what was discussed in the FXTF a while ago, I
> don’t see what the conflict would be. Care to elaborate? :)


Looking 18 months (!) back on this thread, I proposed the following:

mix-blend-mode: color-burn(blur(5px))


Doing it this way will be confusing if we want to blend different elements,
ie

mix-blend-mode: background screen, border multiply, content overlay,
element hue

Now, each of those *could* theoretically blur the backdrop but that is not
a strong use case.
This syntax also gives the impression that your content/border/element has
the effect applied as opposed to the backdrop.

Also, as Michael mentioned, simply blurring will not give you the desired
effect. You often want to soften the backdrop with a white color that's
blended with soft light or screen.
He also mentions:

 we need finer control of the blur opacity/falloff

I'd prefer if we could create a new property that has nice defaults and if
we can avoid writing filter chains in CSS.