CodePen Embed - Clip-path circle

<div class="container">
    <img src="https://img.freepik.com/foto-gratuito/trama-di-foglia-verde-sfondo-di-texture-di-foglia_501050-120.jpg?t=st=1737044241~exp=1737047841~hmac=0f9b41651e1d54f05d5e32531c9aa0e126c9fbb5957bd90bd379024ef8408085&w=1380" alt="Trama di foglia" />
</div>

.container{
  width: 500px;
  height: 500px;
  background-color: lightblue;
  clip-path: circle(20%);
  transition: all 2s ease;
}

.container:hover{
  clip-path: circle(50%);
}

This Pen is owned by Martina Spica on CodePen.

See more by @Martina-Spica on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.