Profound Grid is a fresh grid system for creating responsive layouts (fixed and fluid).
The grid system uses semantic markup and renders just the same in all browsers (it is using negative margins to calculate columns).
It is built with SCSS, has support for nested grids and rules for pulling/pushing columns.
There are various examples provided in Profound Grid’s website and a documentation helps learning it (which is pretty straightforward).
CSS sprites are perfect for minimizing the number of requests made to load the images and improving loading speed.
However, for a sprite with many images, it takes time to create the sprite image and the CSS rules.
SpriteMachine is a very straightforward web application for automating the sprite generation process.
Just upload the images in a .zip file, choose the sprite image orientation (horizontal or vertical) and there you are.
One great thing about the app is, it also asks whether the rules generates should be in CSS, SCSS or SASS.
Gridpak is an interactive web application for generating responsive grid layouts very quickly.
The width of the grid, number of columns, column padding and gutter width can all be defined which are standard features we have seen from several other layout generators.
It gets better with the ability of adding breakpoints for responsive outputs. You can change the size of the layout, click "Add break point" and there you have it.
Once you have setup the layout, a custom download is ready which includes:
