What's this?

This tool helps you to calculate an individual grid layout for your Blueprint-based web site or web application. Being a static grid framework you usually start with defining the total with of your grid and then seperate your workspace into columns. By default Blueprint comes with a 950px grid, which is devided into 24 columns. However, often this configuration is not sufficient to create the kind of layout you have in mind. On the web I found a Blueprint CSS generator, which actually worked pretty nice but lacked the functionality to preview the grid and to compare different grid configuration. As I was tired of the guesswork required to calculate a reasonable grid, I created this little tool to calculate and compare different grid configurations.

About Blueprint

"Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing." Source: www.blueprintcss.org

Blueprint is licensed unter the GPL and the MIT License. Using this tool is absolutely free! Thanks to the Blueprint team for the awsome work!

How does this work?

• Enter the width of your grid.
• Add some constraints for your margin and column width.
• Hit the calculate button to calculate all possible configurations.
• Preview/download the grid.css file and add it to your Blueprint library.

This project is hosted and sponsored by Zeyon.

We develop smart software products to streamline and optimize business processes. Visit us on www.zeyon.net.