Mike Propst User Experience

Smashing runs down Style Guide tools

Pretty good overview here.

At D&B we started with the PHP-based Style Guide Boilerplate tool but ended up maintaining the most low-impact (but highly manual) system possible. It was a single web page. Comments in the HTML told developers where to grab pieces of markup. Not high-tech, and it required a lot of manual maintenance. But it was easy to keep it looking just like the PSD version.

At PAS I implemented StyleDocco using Grunt-StyleDocco. Display leaves a lot to be desired so I ended up diving into the source to modify it. I can now change the template (which is a simple Jade file) and style if necessary.

Why StyleDocco? Short answer: it shows the CSS code. This was important to our developers. StyleDocco creates a new page for every Less file, splits it up by the <h1> elements in the comments, and shows those pieces alongside the HTML and samples.

Visit Link