What is it?

This is the first known Mobile Web App on the internet, and hopefully the last, that requires a desktop. In 2007 Mobile Web Apps became popular with the release of the iPhone. Around 2012 the industry started seeing responsive Mobile, Tablet, and Desktop friendly Web Apps. Responsive Web Apps were far ahead of its time. For years graphic designers have struggled to design responsive websites, until now!


This is a digital graphic designer’s Swiss Army Knife. It provides any designer with the precise feedback they need to comprehend and draw the perfect responsive Mobile, Tablet, and Desktop Web App. In short, it's a dynamic Web App Grid.


To get started click on one of the grids. If you are viewing the web page in full screen, start by resizing the window. Now move the cursor over to the vertical edge of the window until the pointer’s animation is triggered. Left click hold and proceed to play with the size of the window as if it were an accordion, dragging the edge of the window horizontally. If you followed the steps correctly the number of pixels should have changed.

It is recommended to design mobile first and proceed to the template's breaking points 480px, 768px, 992px, and 1200px. Notice how the text wraps at different stages of the window's width.