css有趣的模糊 背景

源自element头部，挺有趣的一种效果，巧用滤镜+背景实现

效果

.base-area {
  width: 300px;
  height: 300px;
  position: fixed;
  top: 50%;
  left: 30%;
  z-index: 999999;
  // 关键的是3句代码
  background-image: radial-gradient(transparent 1px, #fff 1px);
  backdrop-filter: saturate(50%) blur(4px);
  background-size: 4px 4px;
}