Base12 is a framework that provides you with a basic SCSS folder structure for your projects. Its measurements are built around the number 12 for increased flexibility & math goodies.
Because Base12 uses the starting CSS from the HTML5 Boilerplate, it can be used in combination with it.
How do I use it?
- Start a new project with the Classic H5BP
- Replace the
cssfolder with Base12's
- Tweak your preprocessor
- Code away!
Base12, A Different Approach to Numbers
The most important aspect of Base12 is that it's measurements are based on the number 12. Because 12 has a wide range of divisors (1, 2, 3, 4, 6 & 12), it makes it very easy to get a wide variety of sub-measurements while keeping some rhythm in your design.
In this aspect, Base12 is more of a design philosophy. By using multiples/divisors of 12 across our design, we ensure that our numbers are not random but follow some rules. This can make a huge difference when thinking in terms of a baseline and vertical rhythm.