O efeito de grandiente de cores é muito utilizado como fundo das imagens.
Também podemos colocar o fundo numa div que contém uma imagem via CSS.

Nota1 : Coloquei o gradiente como sendo da cor azul indo para a branca mas pode ser feito com outras cores e mais cores.

No final da página estão os estilos que fizeram os gradientes.

Gradiente Linear (linear-gradient(white, blue))

Gradiente Radial radial-gradient(white, blue)

Gradiente Misto-linear-gradient(45deg, #0000FF 0%, #CBEBFF 47%, #A1DBFF 100%);

Gradiente com direção definido pelo usuário (novo)-linear-gradient(to bottom, white, blue)

Gradiente Linear2-versão antiga antes de ser incluída na css3 - Mistura dos gradientes acima

Gradiente Linear2 webkit (Chrome até versão 9, Safari até versão 5)-background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, blue));

Gradiente Linear para o IE 6 em diante - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#0000FF',GradientType=0);

---

Estilos utilizados neste documento:
    <style>
        .linear {
            background: linear-gradient(white, blue);
            height: 100px;
        }

        .radial {
            background: radial-gradient(white, blue);
            height: 100px;
        }

        .gradientemisto {
            background: linear-gradient(45deg, #0000FF 0%, #CBEBFF 47%, #A1DBFF 100%);
            height: 100px;
        }

        .gradientenovo {
            background: linear-gradient(to bottom, white, blue);
            height: 100px;
        }

        .gradientelinear2 {
            background: -webkit-linear-gradient(top, white, blue);
            background: -moz-linear-gradient(top, white, blue);
            background: -o-linear-gradient(top, white, blue);
            height: 100px;
        }

        .gradientelinearwebkit {
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, blue));
            height: 100px;
        }

        .gradientelinearIE {
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#0000FF',GradientType=0);
            height: 100px;
        }
    </style>