The Beauty in CSS Design

A demonstration of what can be accomplished with only 1 K (Kibibyte) of CSS. Select any design from the list to load it into this page.

So What is This About?

Back in 2003 (that's 9 years ago!) Dave Shea launched the CSS Zen Garden. It showcased what was possible with CSS-based designs, leading to an explosion in the use of CSS on the web. More recently, Peter van der Zee created JS1k, a competition to build cool applications with no more than 1 K of JavaScript.

At lot has happened since the Zen Garden days, and today you can do almost anything with only CSS. As CSS use is growing, so is the average CSS file size. Popular sites have in average 27 K of CSS, but some use up to a megabyte of style sheets!

Do we need that much? CSS1K invites you to show that web developers are more inventive than ever, and that limitations can sparkle creativity.

Participation

  1. Submissions must consist of only CSS
  2. Submissions may be up to 1 K (1024 bytes) minified
  3. Vendor prefixes are not counted to the total number of bytes – submit your code unprefixed and we will add necesssary prefixes
  4. Any external resources and images, including data URI's, @font-face and @import's, are forbidden
  5. The page does not have to look the same in every browser, but graceful degradation is encouraged
  6. The submitted code is licensed under the MIT License

To participate, fork CSS1K at GitHub and send your submission as a pull request. You are free to update your style at any time by sending a new pull request. Please specify the name of the style, your own name, and an URL you want us to link to (such as your homepage). If you don't have a GitHub account, you can send in your submission via e-mail.

New entries and updates will be announced by @CSS1K on Twitter.