Demonstrating the power of Cascading Style Sheets

Cascading Style Sheet (CSS) markup is a simple language of style declarations that define how to display HTML elements. Even web designers/developers already using CSS may be unaware of the sheer flexibility that can be achieved through CSS alone.

The CSS Zen Garden, an initiative of Dave Shea (from way back in 2003) is an excellent resource that demonstrates the visual distinction that can be achieved using CSS alone.

The concept is this: By using one page of HTML markup, and without changing it, but only changing the CSS file that this HTML references. The result is a myriad of changing visual designs created by a multitude of contributing CSS designers/developers.

To use the CSS Zen Garden website, choose a design from the ‘Select a design’ panel, and watch things change.

It’s not simply a feast for the eyes, but an inspiring demonstration of the power of CSS, and one where we can all learn something new. View the HTML source. View the CSS. Have fun 🙂

CSS Zen Garden

1 reply
  1. Liam
    Liam says:

    Very powerful.

    I think that guy Dave Shea does some really useful Cheat Sheets too that I have used in the past.

    Perhaps a Sapphire Coast ‘skin’for Zen Garden would be a good exercising of our collective skills? Add to the burgeoning list of To Dos!!!

    Nice share! Thanks.


Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply