html, body {

    width: 100%;

    height: 100%;

}

​

.wrap {

    position: relative;

    height: 100%;

    background: linear-gradient(45deg, #f44336, #ff9800, #ffeb3b, #8bc34a, #00bcd4, #673ab7);

}

​

.inner {

    height: 100%;

    background: #000;

    filter: contrast(500%);

    mix-blend-mode: multiply;

    &::before {

        content: "";

        position: absolute;

        top: 0; right: 0; bottom: 0; left: 0;

        background: radial-gradient(#fff, transparent);

        background-size: 12px 12px;

        mask: linear-gradient(#000, rgba(0, 0, 0, .5));

    }

}