CSS3 image filters with examples | Hacker News Reader

CSS3 image filters with examples

coderwall.com

23 pointsbeghbali14 comments

Finally, I can use my favourite IE5 features in Google Chrome!

The good ol' DHTML days!

I remember as a kid viewing the IE Web Channel (or whatever they called it) demos. I was amazed that the cartoons weren't videos, but actually animated HTML elements!

Thanks for pointing this out. I was about to implement some simple Image Processing (brightness, contrast, invert, etc) for x-ray images and I think the CSS image filters will give me everything I need. It's a research website and nearly everyone is using webkit browsers, so no problem there.

Made a CSS-filter playground a while a go: http://news.ycombinator.com/item?id=4071880

I'm not sure what the point of some of these is. Take the sepia one for example: why do we need a filter just for that? What's the use case?

Interesting to note that the blur one "breaks" out of its box, although not while it's transitioning.

Rollover effects using only 1 image.

Yes, but how many sites have you seen with a sepia rollover effect? It doesn't strike me as terribly useful - it seems to me that a more generic implementation, allowing for some sort of simple filter language would be much more appropriate.

One use I found for sepia (coincidentally, earlier today) was that it allows you to use hue-rotate to tint a colour a particular way that might not be possible otherwise. Unless I was missing something?

The number of sites you see with a given effect is at least partly a function of the difficulty of implementing the effect.

Also, for whatever reason, sepia is a canonical filter that apparently every set of image filters must include, so it would be silly to leave it out.

I'm guessing MS or Netscape implemented these filters, and thanks to them it's eventually being standardised with their filters.

These are actually the precursor for cooler CSS filter effects (shaders, custom svg filters, etc.) These are ones that are "secure", and don't expose the user to any scary potential vulns.

http://news.ycombinator.com/item?id=4218709

...and the gap between native and web ui gets even narrower.

Reply on news.ycombinator.com