Image to SVG tool, CSS Grid and SASS and CSS loaders library – Design round up #5

Hi and welcome to our design resources roundup for this week!

Combine the transparency of a PNG with the compression of a JPEG

An amazing online tool to shrink and convert your images with transparent background in SVG. Based on the idea from Using SVG to Shrink Your PNGs, but adapted to use data URIs instead of external images. Include on your page as inline SVG, using a tag, or as a background-image.

Browser Compatibility for CSS Grid Layouts with Simple Sass Mixins

CSS Grid layouts are the new game changer and according to an article from A List Apart about CSS Grids, a “new era in digital design is dawning right now.”
With Flexbox and Grid, we have the ability to create layouts that used to be extremely difficult to implement, when not flat out impossible.

Loaders.css

The last link of this roundup is a nice collection of loading animations written entirely in CSS. Each animation is limited to a small subset of CSS properties in order to avoid expensive painting and layout calculations.

That’s it for this week; come back next friday for more design links, or check back on monday for another development roundup!