Membuat Background Gradient dengan CSS
Dalam membuat background dengan kombinasi beberapa warna pasti membutuhkan fungsi "Gradient". Secara teori Funsi Gradient terbagi menjadi dua bagian yaitu :
- Funsi Linear Gradient
Yaitu Funsi Gradient yang membuat kombinasi warna secara tegak lurus. dengan funsi CSS Linear Gradient kita dapat membuat background kombinasi warna secara tegak lurus. Berikut ini contohnya :
#linear-gradient{
width:200px;
height:200px;
background:linaear-gradient(red,blue);
}
width:200px;
height:200px;
background:linaear-gradient(red,blue);
}
maka hasilnya :
- Kombinasi Tiga Warna secara gradient dengan garis miring
Contoh :
#linear-gradient{
width:200px;
height:200px;
background:linaear-gradient (175deg, red,yellow,green);
}
width:200px;
height:200px;
background:linaear-gradient (175deg, red,yellow,green);
}
maka hasilnya :
- Funsi Radial Gradient
Yaitu Funsi Gradient yang membuat kombinasi warna secara tegak lurus. dengan funsi CSS Linear Gradient kita dapat membuat background kombinasi warna secara tegak lurus. Berikut ini contohnya :
#radial-gradient{
width:200px;
height:200px;
background:radial-gradient(yellow,red);
}
width:200px;
height:200px;
background:radial-gradient(yellow,red);
}
maka hasilnya :
Itu saja yang dapat saya sampaikan kurang lebihnya saya mohon maaf. Terima kasih telah menyimak. semoga bermanfaat.