Discover LA via Custom Filters

This is a one-page web app that uses custom filters provide subtle enhancements that showcases how GLSL shaders can lead to a more natural experience for the end user.

This app uses touch/click behaviours to trigger the use of various shaders without significant loss of performance.

Requirements

Open src/index.html or the hosted version of the custom filters demo travel app in Chrome Canary with the chrome://flags/#enable-css-shaders flag enabled.

What are Custom Filters?

Custom Filters are functions that allow you to use GLSL shaders on elements that are selected via CSS Selectors using the filter CSS property with a value that is a custom function.

The Filter Effects 1.0 Editor's Draft dives into more details & provides examples as well or you can see some more details on html.adobe.com/webplatform/graphics/customfilters/

Credits

Edan Kwan for development

David Vale for design