Halo teman-teman kembali dengan saya, jika postingan saya sebelumnya membahas tentang Cara Menggunakan Property filter Pada CSS. Maka pada postingan kali ini saya akan memperjelas Cara Menggunakan Value di Property Filter Pada CSS.
Seperti yang sudah dibahas di postingan sebelumnya value pada property filter pada CSS itu ada banyak, diantaranya:

  • blur()
  • brightness()
  • contrast()
  • greyscale()
  • hue-rotate()
  • invert()
  • opacity()
  • saturate()
  • sepia()
  • drop-shadow()
  • url()

Saya akan membahas satu per satu dari value tersebut

Blur():

Fungsi blur() adalah mengambil dalam parameter-radius-yang mendefinisikan nilai standar deviasi untuk fungsi Gaussian blur. Dengan kata lain, ia mendefinisikan berapa banyak piksel pada layar campuran ke satu sama lain. Semakin besar jari-jari yang lebih banyak piksel akan berbaur dengan satu sama lain dan karenanya lebih kabur elemen akan. Nilai nol meninggalkan elemen berubah.
Radius dilewatkan ke fungsi blur () adalah <panjang> nilai. Semua nilai panjang mungkin diterima kecuali persentase. nilai negatif tidak diperbolehkan. Jika tidak nilai dilewatkan, default nilai nol ‘0’. Contoh:

Brightness():

Sama seperti artinya yaitu membuat gambar menjadi lebih terang atau kurang terang. Ini menyesuaikan warna gambar antara benar hitam (nol brightness) dan warna gambar asli (100% brightness). Nilai nol akan membuat gambar benar-benar hitam. Nilai melampaui 100% akan meningkatkan kecerahan gambar. Semakin tinggi nilai kecerahan yang lebih cerah gambar akan terlihat. Misalnya, nilai 200% akan membuat gambar tampak dua kali lebih terang dari awalnya. Nilai negatif tidak diperbolehkan. Sebuah nilai yang dinyatakan dengan tanda persen (seperti dalam 56%) juga dapat dinyatakan sebagai desimal (seperti dalam 0.56).

Contrast():

Fungsi filter contrast () menyesuaikan kontras input. Artinya, itu menyesuaikan perbedaan antara bagian paling gelap dan paling ringan dari gambar masukan. Dan untuk aturan penulisan number atau persentase contrast itu sendiri mirip dengan brightness().

Grayscale():

Fungsi filter grayscale () mengkonversi gambar input untuk warna abu-abu. Nilai yang dikirimkan ke fungsi mendefinisikan proporsi konversi. Sebuah nilai 100% benar-benar abu-abu, jadi semuanya akan menjadi warna abu-abu. Nilai antara 0% dan 100% adalah pengganda linear pada efek; yaitu semakin tinggi persentase yang teman-teman atur, maka gambat tersebut akan semakin kehilangan warna aslinya dan berubah menjadi abu-abu.

Dan untuk beberapa Value di Property Filter Pada CSS filternya akan dibahas dipostingan berikutnya. Semoga bermanfaat