css backdrop-filter.blur.demo

backdrop.blur.demo.html

<div style="
    position: fixed;
    background: rgba(253, 202, 202, 0.26);
    padding: 100px 180px;
    z-index: 100;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    border-radius: 50px;
    -webkit-mask-image: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 15%, rgba(0,0,0,1) 85%, rgba(255,255,255,0) 100%),linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 15%, rgba(0,0,0,1) 85%, rgba(255,255,255,0) 100%);
    backdrop-filter: blur(6px);
    -webkit-mask-composite: destination-in;
    text-align: center;
">Hello Backdrop filter</div>