Before the Compositing and Blending specification was introduced, CSS allowed one type of composite operations: simple alpha compositing. This is what the
opacityproperty is for. By changing an element’s opacity, the browser makes it translucent so that the colors of its backdrop can show through.
Today, two main properties exist that allow us to blend elements and backround images by specifying one of 16 available blend modes. These two properties are
mix-blend-mode. Let’s get to know each.