Cara Membuat Gradasi Warna di Menu Blog

Cara Membuat Gradasi Warna di Menu Blog
Gradasi warna di menu blog membuat tampilan blog menjadi lebih berwarna begitu juga dengan pengunjung akan semakin betah berlama-lama dengan tampilan tersebut.

Meskipun tampilan tersebut mempercantik blog tapi dengan adanya gradasi warna pada template blog akan membuat loading blog semakin lambat.

Bukan berarti sangat lambat, tapi dibandingkan tidak menggunakan gradasi warna maka template akan sedikit lebih cepat.

Dengan penggunaan warna yang tepat akan mempercantik blog Anda, sebaliknya jika warna yang digunakan tidak tepat maka hasilnya akan membuat pengunjung maupun orang yang melihat tidak betah karena terganggu pada tampilan menu yang kurang baik tersebut.

Gradasi warna yang ada dalam artikel ini memiliki tampilan yang sangat menarik, jadi silahkan untuk di terapkan jika Anda tertarik dengan tampilan gradasi warna seperti pada gambar di bawah ini.

Gradasi Warna di Menu Blog

Cara Membuat Gradasi Warna di Menu Blog


Pertama yang harus dilakukan yaitu, masuk ke Blogger > pilih menu Tema > klik Edit HTML dan tambahkan kode di bawah ini sebelum atau di atas kode ]]></b:skin>.

/* Gradasi Warna */
#header-container{background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);background-size: 400% 400%;-webkit-animation: Gradient 15s ease infinite;-moz-animation: Gradient 15s ease infinite;animation: Gradient 15s ease infinite;}
@-webkit-keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}@-moz-keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}

Kemudian simpan template dan lihat hasilnya.

Untuk kode pemanggil (#header-container) silahkan disesuaikan dengan kode pemanggil pada template Anda.

Jika ada pertanyaan silahkan langsung tanyakan melalui kolom komentar di bawah ini.
Berikan Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel