JSFiddle - React, Tailwind, and code Playground

HTML

<div id='Block'>
  <div id='SubBlock'></div>
</div>

CSS

#Block {
  position: absolute;
  height: 100px;
  width: 100px;
  left: 100px;
  top: 100px;
  background-color: white;
}

#Block:hover {
  overflow: hidden;
}

#SubBlock {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  background-color: #ff48a7;
  
  transition: filter 0.25s;
}

#Block:hover #SubBlock {
  filter: blur(1vw);  
}