I’m a big fan of tools to help me with my work, especially if they’re web-based. I have great love for the Firefox ‘Web Developer’s‘ extension but I just came across a tool today that I’m quite excited about; It’s called Design and it’s a Javascript bookmarklet that helps with measurement and alignment in web design.
Design is a suite of web-design and development assistive tools which can be utilised on any web-page. Encompassing utilities for grid layout, measurement and alignment, Design is a uniquely powerful JavaScript bookmarklet.
Below are some screenshots of the bookmarklet in action.
Grid: Overlays a highly configurable layout grid over a web-page. Grid can be set to match any set of dimensions, allowing easy development of CSS layouts in the web-browser.
Ruler: Displays rulers on a page, with all the expected features of the rulers found in a desktop design application, including guides which snap to block display elements and origin location control.
Unit: Allows measurements to be made between any two points on a web-page, giving basic information about each of the points clicked on, and drawing a line on the page for the measurement.
Crosshair: Draws a crosshair cursor on the page to assist in layout alignment. Cursor information is also presented in a tooltip.
Subscribe via RSS Subscribe via Email
Propaganda Party is the digital soapbox of web designer Jen Huls.
© Copyright 2009 Propaganda Party/Pop Stalin Design/Jen Huls
Powered by WordPress
Theme Design by Pop Stalin Design
Hosted by
2 People Have Bloviated
Lorissa | Jan 3
Ooohh, interesting! I need to give this a whirl.
Pop Stalin | Jan 3
It’s quite fun to use, though there are so many options available, I’ll have to take an afternoon just to familiarize myself with them.