Triangulo via CSS

Fazer um triângulo via CSS

HTML

<div class="color">
    <div></div>
</div>

CSS

body{
    background:gray;
}
.color{
    width:40px;
    height:40px;
    background:white;
}
.color > div{
    border-top: 20px solid black;
    border-right: 20px solid blue;
    border-bottom: 20px solid green;
    border-left: 20px solid red;
}