These days, everyone is consuming content differently. My mom has a netbook, I have a laptop, my friend has a 27″ iMac, my girlfriend and I have smartphones and her mom has an iPad.

Since your content is now being viewed on more devices and browsers than ever before, you have to design it with that in mind. Websites that adapt to things like screen sizes and operating systems are known as responsive designs, and this list of 10 sites shows off the future of the flexible Web.

Bread & Pepper

breadpepper 520x295 10 Beautiful examples of responsive Web designBread & Pepper is a software company that creates simple interfaces with spicy code.

➤ Bread & Pepper


UPPERDOG 520x296 10 Beautiful examples of responsive Web designThough most browser windows aren’t constantly dragged around, it’s nice that this site adjusts seamlessly (never jumpy).


Food Sense

Food Sense Plant Based Eating At Its Best 520x326 10 Beautiful examples of responsive Web designThe logo bounces from the side to the top-center on this site.

➤ Food Sense (via Splashnology)


HÅRRISON by harrison 520x306 10 Beautiful examples of responsive Web designInstead of building out separate apps, Jux has heavily invested in a single, responsive Web design to elegantly adjust to different devices, like the iPhone, iPad and desktop (Disclosure: I worked with them before TNW).

➤ Jux

Endloop Mobile

endloop 520x265 10 Beautiful examples of responsive Web designEndloop Mobile’s site was built off of a heavily modified responsive wordpress theme.

➤ Endloop Mobile


gravitate 520x328 10 Beautiful examples of responsive Web designGravitate looks elegant at any size.

➤ Gravitate (via WebDesignDev)

Think Vitamin

think vitamin 520x269 10 Beautiful examples of responsive Web designThink Vitamin completely kills its sidebar at smaller sizes.

➤ Think Vitamin

Clean Air Works  520x346 10 Beautiful examples of responsive Web designClean Air Works completely reformats its menu at smaller sizes.

➤ Clean Air Works (via WebDesignDev)

CSS Grid

The 1140px CSS Grid System · Fluid down to mobile 520x338 10 Beautiful examples of responsive Web designCSS Grid’s site is built around the purpose of using a flexible grid.

➤ CSS Grid

Responsive Illustration

screen shot 2012 01 04 at 7 33 47 pm 10 Beautiful examples of responsive Web designBuilt using HTML/CSS + media queries, “this is a simple interactive experiment with responsive design techniques.” We wrote about it previously, here.

➤ Responsive Illustration

The growing connectivity in our society leads to some amazing results, keeping information flowing at an astounding rate, while bringing people closer together. But there some downsides to this new era of consumption, one of them being the way websites are currently designed.

Anyone with a mobile device knows how difficult it can be to browse the Web, but it doesn’t have to be that way. More and more designers are utilizing Responsive design techniques, and it will soon become expected practice for every new Web design — if it isn’t already!

For more, check out this list of Design Inspiration by TNW.