Home Contact Us Disclaimer Privacy Police
Home  ›  Blog  ›  Blogger  ›  SEO  ›  Tips  ›  Widget

Membuat Animasi Gradient Color

Tutorial Cara membuat Animasi Gradient Color (Warna) background blog dengan css.

Membuat Animasi Gradient Color

Berikut Tutorial untuk membuat Animasi Gradien warna pada Background Blog :

Related Post:

1. Login ke akun Blogger
2. Pilih Edit HTML
3. Letakkan Kode css, Animasi Gradient Color di antara <b:skin> .... </b:skin>
4. Sebaiknya letakkan tepat di atas </b:skin>
NamaElement{
    background: linear-gradient(45deg, #f22613, #f89406, #26a65b, #5868ec, #f54e80, #f7ca18, #d2527f);
    background-size: 500% 500%;
    -webkit-animation: NamaElement 12s ease infinite;
    -moz-animation: NamaElement 12s ease infinite;
    animation: NamaElement 12s ease infinite;
}
@-webkit-keyframes NamaElement {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes NamaElement {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes NamaElement {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

Untuk Warnanya kamu bisa menggantinya dan menambahnya lebih dari 4 warna dengan tanda # seperti contoh di atas

5. Cari Element yang background-nya akan di beri Animasi Gradient
6. Element tersebut biasanya di awali dengan tanda # atau .
7. ganti #NamaElement atau .NamaElement dengan Element yang ingin backgroundnya kamu beri Animasi Gradient.
8. Terakhir, Save dan lihat hasilnya
untuk Contoh hasilnya seperti di bawah.

Contoh

Membuat Animasi Gradient Color

Membuat Animasi Gradient Color


Author : TIRINFO

datePublished : 12/04/2019 02:09:00 AM

Organization : Tirinfo.com

logo TIRINFO

Url : https://www.tirinfo.com/2019/12/membuat-animasi-gradient-color.html

Share: