Cloth (CHROME ONLY!)

by bradleygriffith

HTML

<!--

HEY YOU.

This seems to only be working in webkit 
browsers for now. 

This is just an experiment and probably not
a good alternative to images just yet.

-->

CSS

body {
        background-color: #CCBBAB;
        background-image: -webkit-radial-gradient(rgba(221, 77, 39, .6) 10%, transparent 13%),
                          -webkit-radial-gradient(rgba(153, 102, 84, .2) 10%, transparent 13%),
                          -webkit-radial-gradient(rgba(255, 255, 255, .6) 10%, transparent 13%),
                          -webkit-linear-gradient(0deg, rgba(85, 68, 50, .2) 27%, transparent 50%, transparent),
                          -webkit-radial-gradient(rgba(252, 218, 212, .5) 8%, transparent 13%);
        background-size:7px 7px, 7px 7px, 7px 7px, 4px 3px, 7px 7px;
        background-position: 0 0, 2px 2px, 4px 4px, 1px 1px, 2px 2px;
}

body:before {
    content: ' ';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: -webkit-radial-gradient( rgba(170, 136, 119, .3) 30%, rgba(85, 68, 50, .3) 95% );
    background-size: 100% 100%;
}