Hai teman-teman semuanya, apa kabar? kita balik lagi pada tutorial dumet school, kita lanjut pembelajaran kita tentang efek-efek filter yang ada pada css, pada tutorial kali ini kita akan membahas tetang cara memanipulasi gambar dengan efek filter hue-rotate pada css.

Pada tutorial sebelumnya saya telah menjelaskan apa itu filter pada css, yups filter adalah salah satu teknik adjusment yang kita kenal di photoshop, namuan dengan propertis filter ini kita bisa menerapkannya di css, nilai dari propertis filter ini ada banyak, dan kali ini kita akan praktekan nilai hue-rotate pada filter css.

Oke untuk lebih jelasnya kita langsung saja praktek, pertama teman-teman silahkan buat sebuah file dan siapkan satu buah gambar, lalu coba teman-teman ketikan script seperti dibawah ini:

Saya menyisipkan satu buah gambar yang telah saya siapkan sebelumnya, nah jika teman-teman jalankan pada browser hasilnya masih seperti ini:

memanipulasi gambar dengan efek filter hue-rotate pada css 1

tidak ada efek apa apa karna keadaan gambar masih normal, nah sekarang kita akan memanipulasi warna pada gambar tersebut dengan filter hue-rotate pada css, silahakan teman-teman tambahkan script CSS seperti berikut ini :

saya mengatur filter pada gambar dengan nilai hue-rotate(155deg) dan jika teman-teman save maka hasilnya akan seperti berikut ini:

memanipulasi gambar dengan efek filter hue-rotate pada css 2

hasilnya warna akan termanipulasi seperti gambar diatas, teman-teman bisa sesuaikan nilai deg sesuai dengan yang teman-teman inginkan, gimana teman-teman cukup mudah bukan? saya kita untuk tutorial kali ini tentang memanipulasi gambar dengan efek filter hue-rotate pada css  cukup sampai sini dulu, semoga tutorial kali ini dapat bermanfaat untuk teman-teman semuanya, sampai bertemu lagi pada tutorial berikutnya.

Terima kasih.