mix-blend-mode
Properti CSS mix-blend-mode digunakan untuk menentukan mode campuran untuk memadukan elemen dengan latar belakangnya
(backdrop).
Backdrop adalah konten di balik elemen (dikenal sebagai elemen sumber) dan merupakan elemen yang dikomposisikan dengan elemen tersebut.
Elemen destination (tujuan) adalah elemen yang terletak di belakang elemen sumber, dan yang tumpang tindih dengan sumber.
Backdrop merupakan area di mana pencampuran warna dilakukan antara sumber dan tujuan.
Backdrop adalah area di mana pencampuran warna dilakukan antara sumber dan tujuan.
Properti mix-blend-mode dapat digunakan untuk menggabungkan elemen apa pun dengan latar belakangnya.
Misalnya, kamu dapat mencampur teks dengan apa saja yang tumpang tindih, gambar dengan gambar lain, header dengan konten scroll halaman.
CSS Syntax
mix-blend-mode: normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | difference |
exclusion | hue | saturation | color | luminosity;
JavaScript Syntax
object.style.mixBlendMode = "darken"
| Default value: | normal |
|---|---|
| Inherited: | tidak |
| Animatable: | tidak Read about animatable |
Attribute Value
default
mix-blend-mode: normal;
mix-blend-mode: multiply;
mix-blend-mode: screen;
mix-blend-mode: overlay;
mix-blend-mode: darken;
mix-blend-mode: lighten;
mix-blend-mode: color-dodge;
mix-blend-mode: color-burn;
mix-blend-mode: hard-light;
mix-blend-mode: soft-light;
mix-blend-mode: difference;
mix-blend-mode: exclusion;
mix-blend-mode: hue;
mix-blend-mode: saturation;
mix-blend-mode: color;
mix-blend-mode: luminosity;