Membuat background keren dengan CSS3 Linear Gradients

CSS3 Linear Gradients ini pasti keren bagi anda pecinta desain warna dengan background yang unik tentunya, dengan css3 linear gradient ini background blog akan lebih cantik dan keren, nah seperti apakah bentuk background ini. . .? silahkan lihat demonya

DEMO

Nah gimana gan anda tertarik gak, jika tertarik silahkan ikuti langkah - langkahnya :

1. Masuk di blog anda
2. Klik Rancangan
3. Klik Edit HTML
4. Cari kode seperti ini

body {
background:

}

Hapus kode background: dan ganti dengan kode di bawah ini.

1. LINEAR DARI PUTIH KE BIRU

background: -webkit-linear-gradient(right, #00abeb, #fff);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00abeb), color-stop(1, #fff));
background: -moz-linear-gradient(right, #00abeb, #fff);
background: -o-linear-gradient(right, #00abeb, #fff);
filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr=#00abeb, EndColorStr=#fff)";
background: linear-gradient(right, #00abeb, #fff);
background: -webkit-gradient(linear, right center, left center, from(#00abeb), to(#fff));

2. LINEAR DARI KUNING KE ABU - ABU

background:-moz-linear-gradient(left top 315deg,orange,yellow 30%,white 40%);
background:-webkit-linear-gradient(color-stop(30%,color-stop(40%),gray));
background:-webkit-gradient(linear,left top,left bottom,color-stop(0,color-stop(30%),color-stop(1,color-stop(40%)),gray));
background:-moz-linear-gradient(color-stop(30%,color-stop(40%),gray));
background:-o-linear-gradient(color-stop(30%,color-stop(40%),gray));
filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=color-stop(30%,EndColorStr=color-stop(40%)";
background:linear-gradient(color-stop(30%,color-stop(40%),gray));

3. LINEAR BIRU DI TENGAH

background:-moz-linear-gradient(center top,#b8d8f2,#92bde0 25%,#3282c2 50%,#92bde0 75%,#b8d8f2);
background:-webkit-linear-gradient(color-stop(25%,color-stop(50%),#3282c2),color-stop(75%,#92bde0),to(#b8d8f2));
background:-webkit-gradient(linear,left top,left bottom,color-stop(0,color-stop(25%),color-stop(1,color-stop(50%)),#3282c2),color-stop(75%,#92bde0),to(#b8d8f2));
background:-moz-linear-gradient(color-stop(25%,color-stop(50%),#3282c2),color-stop(75%,#92bde0),to(#b8d8f2));
background:-o-linear-gradient(color-stop(25%,color-stop(50%),#3282c2),color-stop(75%,#92bde0),to(#b8d8f2));
filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=color-stop(25%,EndColorStr=color-stop(50%)";
background:linear-gradient(color-stop(25%,color-stop(50%),#3282c2),color-stop(75%,#92bde0),to(#b8d8f2));

4. LINEAR WARNA PELANGI

background:-moz-linear-gradient(left,red,orange,yellow,green,blue,indigo,violet);
background:-webkit-linear-gradient(color-stop(14%,color-stop(28%),yellow),color-stop(42%,green),color-stop(56%,blue),color-stop(70%,indigo),to(violet));
background:-webkit-gradient(linear,left top,left bottom,color-stop(0,color-stop(14%),color-stop(1,color-stop(28%)),yellow),color-stop(42%,green),color-stop(56%,blue),color-stop(70%,indigo),to(violet));
background:-moz-linear-gradient(color-stop(14%,color-stop(28%),yellow),color-stop(42%,green),color-stop(56%,blue),color-stop(70%,indigo),to(violet));
background:-o-linear-gradient(color-stop(14%,color-stop(28%),yellow),color-stop(42%,green),color-stop(56%,blue),color-stop(70%,indigo),to(violet));
filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=color-stop(14%,EndColorStr=color-stop(28%)";
background:linear-gradient(color-stop(14%,color-stop(28%),yellow),color-stop(42%,green),color-stop(56%,blue),color-stop(70%,indigo),to(violet));

Pilih salah satu ya, kenapa banyak kodenya. . .?
Sengaja, karena untuk kross browser atau bisa di bilang menyesuaikan warnanya dengan browser, karena ini CSS3, dimana masih belum semua browser mendukung css3, ok deh setelah itu SIMPAN TEMPLATE dan lihat hasilnya.