GPU Acceleration of CSS Filters in Chromium
One of the innovations in Chromium 19 is CSS filters with hardware graphics acceleration. Using the property
Combining different parameters in a line, you can come up with original effects.
Filter parameters: sepia, saturation, transparency, blur, brightness, inversion, contrast, shadow creation and others. This is a great way to improve the design of the page, as well as create web applications and games with new features.
In the presence of a normal GPU-card, the effects work completely without slowdowns and even allow you to run the graphical editor in a browser, fully implemented in CSS, and even with the use of animation
For more information on using CSS-filters, see. For filters reference to HTML5Rocks ( translated into Russian. LANG. ).
We add that in the future, web designers will have the opportunity to create their own filters to apply them exclusively on their site.
filter
, pixel-by-pixel processing of any visible element on the page is performed - with just one line of CSS. Combining different parameters in a line, you can come up with original effects.
img { -webkit-filter: sepia(100%) contrast(200%) blur(5px) }
Filter parameters: sepia, saturation, transparency, blur, brightness, inversion, contrast, shadow creation and others. This is a great way to improve the design of the page, as well as create web applications and games with new features.
In the presence of a normal GPU-card, the effects work completely without slowdowns and even allow you to run the graphical editor in a browser, fully implemented in CSS, and even with the use of animation
-webkit-transition
.For more information on using CSS-filters, see. For filters reference to HTML5Rocks ( translated into Russian. LANG. ).
We add that in the future, web designers will have the opportunity to create their own filters to apply them exclusively on their site.