Mark Cipolla

Designer & Developer

Vivus —
A ruby gem that builds a living, breathing styleguide.

You can try it out by visiting Vivus and read the installation instructions.


Vivus analyses the comments in your SASS files, and by adding markdown to your stylesheets, you can generate a living, breathing documentation styleguide that has examples of how the CSS is used.

Manual styleguides become stale. As time passes, keeping the styleguide current gets harder, and often we just plain forget.

Also, the documentation for CSS (especially in styleguides) requires very specific documentation syntax.

Furthermore, CSS is separate to the use and to the docs. Even with other styleguide gems, you end up with code in three places:

  • In your CSS file,
  • in your HTML Examples,
  • and in the HTML that your app actually uses.

Inevitably, we forget to update one of the places and the styleguide is no longer relevant to the CSS and it's use.

Hence, by consolidating CSS and HTML examples in your SASS files,you can better keep a current example of how your code is meant to be used.