CSS Zen Garden

For years when trying to convey the power and pupose of CSS I’ve deferred to a single example; CSS Zen Garden. I’ve always been so impressed by the demonstation of this project and contributions from designers all over the world. The basis of CSS Zen Garden is to take the exact same HTML content, and without making ANY changes to the HTML, create a completely unique visual design and portrayal of the content.

For those of you who think CSS is merely changing fonts and colors, try out a few examples found on CSS Zen Garden and you will be amazed at the huge range in presentations.

Here are a few of my favorites:

Care to take a look at the base HTML? Click here to view the HTML without any CSS styling.

CSS Zen Garden: The Book

If you are interested in learning more about the history behind this project, the original creators have released a book which I highly recommend.

2 thoughts on “CSS Zen Garden

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s