Software > Responsive Design Test Bookmarklet

Responsive Design Test Bookmarklet

This was inspired by, and based on @lensco's excellent Simple Responsive Design Test Page. It lets you view any webpage in multiple screen sizes, simulating the viewport of different devices. After getting such a positive response to my original post, I thought I'd expand on it a little. Since people are obviously targeting different device screen sizes with their projects, the form below now lets you generate a custom bookmarklet that displays only those device sizes you're interested in.

A big thanks to Alaska Airlines for the delayed flight that made this possible, and the really boring project that I know I should be working on, but can't find the motivation. Urgh.

1. Select Device Sizes

  •  
  • Width (px)
  • Height (px)
  • Label
  •  
  • x
  •  
  • x
  •  
  • x
  •  
  • x
  •  
  • x
  •  
  • x

2. Generate the Bookmarklet

Generate!

Drag the following link to your bookmark toolbar in your browser, and click on it. Man, I love javascript.