Responsive web resources

Responsive webdesign has been a hot topic for a while, but I tend to loose track of all useful resources that cross my path. So I’ll try to make list them up.

Feel free to share resources you find useful too!

If you’re not familiar with responsive webdesign I suggest you check out this nice presentation from @bytte:


CSS Frameworks:

HTML5 boilerplate

HTML5 Boilerplate is the professional badass’s base HTML/CSS/JS template for a fast, robust and future-proof site.


Golden Grid System (GGS) splits the screen into 18 even columns. The leftmost and rightmost columns are used as the outer margins of the grid, which leaves 16 columns for use in design.

320 and up

‘320 and Up’ starts with a tiny screen stylesheet that contains only reset, colour and typography styles. Media Queries then load assets and layout styles progressively and only as they’re needed.


Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone.


An easy to use, powerful, and flexible framework for building prototypes and production code on any kind of device.


Gridless is an optionated HTML5 and CSS3 boilerplate for making mobile first responsive, cross-browser websites with beautiful typography.


The Responsive grid generator, created by Erskine Design.

Embedding media

fitvidjs (video)

A lightweight, easy-to-use jQuery plugin for fluid width video embeds.




A jQuery plugin for radical web typography


FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.




Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library.


Making things work cross browser


selectivizr is a JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8. Simply include the script in your pages and selectivizr will do the rest.


Contributions by @baskwalla, @driesdeleay@wolfr, @bengie & @paulirish 


3 Responses to “Responsive web resources”

  1. Wolf says:

    I would add foundation by Zurb: and delete Golden Grid since it’s highly inflexible.

  2. bengie says:

    Maybe another resource :
    The Responsive grid generator – Created by Erskine Design

  3. [...] Bookmarked responsive web resources | Bloggink [...]

Leave a Reply