Cara Membuat Background dengan Gradien Warna

K ita dapat membuat gradien warna sebagai background dengan CSS. Dengan adanya gradien warna tersebut membuat suasana lebih berwarna. Namun diperlukan keahlian memadukan warna, karena keterpaduan warna akan menambah keindahan. Sebalikya jika warna yang dipadukan kurang sesuai akan menimbulkan kesan menjemukan. Ingin tahu ? Berikut cara membuat gradien warna.


Copy kode berikut :

<div style="background: -moz-linear-gradient(45deg, red, orange, yellow, green, blue, indigo, violet); background: -webkit-gradient(linear, left bottom, right top, from(red), color-stop(16%,orange), color-stop(32%,yellow), color-stop(48%,green), color-stop(64%,blue), color-stop(80%,indigo), to(violet));"> Contoh Isi Teks</div>

Wellcome to my World

Anda bisa menentukan sendiri jumlah warna untuk background gradien: dua, tiga, dan seterusnya. Anda juga bisa menggunakan kode warna contoh : ‘#FF0000′, ‘#336699′, dan lain-lain sebagai warna gradien. Sahabat tentu juga bisa dengan mudah menggganti arah gradien yang lain, yaitu dengan mengganti besar sudut (45deg) menjadi nilai diantara 0deg sampai 360deg, dan ganti juga ‘left bottom’, dan ‘right top’ sesuai keinginan.: Contoh yang lain

<div style="background: -moz-linear-gradient(top, #FF0000, #FFFF00); background: -webkit-gradient(linear, left top, left bottom, from(#FF0000), to(#FFFF00));"> Contoh Isi Teks</div>

Selamat datang di duniaku

Selamat mencoba semoga semakin indah dunia ini.

Label :Tutorial