→  CSS - треугольники

С помощью простых элементов — div, можно создать треугольники без использования графики. Возьмем простую html-разметку

<div class="t-up"></div>
<div class="t-down"></div>
<div class="t-left"></div>
<div class="t-right"></div>

Теперь с помощью не хитрых css преобразований, а именно, поигравшись со свойством border:

.t-up {
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;   
    border-bottom: 10px solid maroon;
}

.t-down {
    width: 0; 
    height: 0; 
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;   
    border-top: 25px solid lightBlue;
}

.t-right {
    width: 0; 
    height: 0; 
    border-top: 45px solid transparent;
    border-bottom: 45px solid transparent;  
    border-left: 45px solid lightGreen;
}

.t-left {
    width: 0; 
    height: 0; 
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;   
    border-right: 5px solid yellow; 
}

В результате мы получим:

Используются технологии uCoz