Existen demasiados tipos de gradientes, en distintas direcciones y tamaños, pero en esta oportunidad nos centraremos únicamente en uno circular superior.

El gradiente se verá mas o menos así:




Debes saber que esto funciona sobre navegadores webkit (Chrome, Safari, etc), bajo Firefox, y sobre la futura versión de Internet Explorer (IE10)

Primero, vé a ''Diseño | Edición HTML'' (''Plantilla | Editar Plantilla'' si utilizas Blogger 2011), deberás buscar en la zona CSS  el body (Antes de ]]></b:skin>), el cual se encuentra casi al inicio.

Es un código muy similar a este:

body {

Debajo de este, deberás pegar el siguiente:

background:#111; /*Color de fondo si no funciona el efecto en algun navegador*/
background-image:-moz-radial-gradient(center -100px 45deg, circle farthest-corner, #444 150px, #111 300px); /*Gradiente Firefox*/
background-image: -ms-radial-gradient(center -100px 45deg, circle farthest-corner, #444 150px, #111 300px); /*Gradiente IE10*/
background-image:-webkit-gradient(radial, 50% 0, 150, 50% 0, 300, from(#444), to(#111)); /*Gradiente webkit*/

Guarda los cambios y listo.

• Es posible que en blogs con cabeceras muy grandes no se pueda ver porque el contenido lo sobreponga, para ello aumenta el valor 150 y 300 de todos los códigos y listo.