As the lines between fixed and mobile Internet access continue to blur, the use of responsive or flexible web designs that accommodate visitors regardless of their viewing platform are increasingly gaining in popularity.
To address this, designers are turning to the blank canvas provided by frameworks that allow design options to be quickly spun up without designers having to reinvent the wheel, by incorporating pre-formatted CSS and coding blocks as a fast prototyping tool.
Cute grids was made from the frustration of today’s world full of large overbuilt frameworks that can be overkill for most projects. -Darren Newberry
According to its publisher, Darren Newberry, Cute Grids (www.cutegrids.com) is a lightweight CSS framework that provides a clean base for responsive website designs.
Cute Grids uses five “em” width-based media queries to target five different screen sizes to accommodate nearly any device; allowing developers to choose the layout that best suits their design goals.
Cute Grids’ “mobile first” grid system provides mobile and tablet users with the best possible experience — using clean code without any predefined design limits in order to provide designs that work across all devices, from mobile phones to desktop computers.
Built from the ground-up with the needs of responsive designers in mind, Cute Grids forms a solid base for building any website, allowing full customization of how you want your site to look, with detailed documentation that helps users get started, with example code snippets illustrating how the different features work and how to implement them in a Cute Grids based responsive site.
“Cute grids was made from the frustration of today’s world full of large overbuilt frameworks that can be overkill for most projects and restrict the creativity of the designer with too many inbuilt design features that can make even the most creative person lazy,” Newberry notes. “With too many underused features and over bloated code in many frameworks the idea of cute grids is to clean out all the dirty stuff and leave you with a clean base to let you get on with designing your responsive site the way you like.”
Despite its simplicity, Cute Grids is not a featureless minimum grid system.
“It has been built with most features that are seen fit to make your grid work the way you need it to,” Newberry added. “This is just clean CSS. No SASS, No LESS.”
Despite the last comment, however, Newberry leaves open the possibility of a future version using SASS, for further appeal.
Like other similar frameworks, Cute Grids contains rows and columns, with every row holding up to 12 columns, each of which serves as a container for holding content.
Cute Grids’ 12 column responsive layout targets smaller phones at 30em (480px) and lower, plus larger phones at 48em (768px) and lower; as well as tablets at 48em (768px) and above, laptops at 62em (992px) and above, along with desktops at 75em (1200px) or higher screen sizes, making layout easy.
Cute Grids allows users to modify offsets, padding and column order, among other parameters and includes an optional CSS reset along with a plugin for responsive images.
Although Cute Grids may be a bit more basic in its offerings than some competitors, its ease of use and lightweight coding make it a great starting place for your next project.