Clippy Page …
AltText for the image
AltText for the image
AltText for the image
AltText for the image
AltText for the image
AltText for the image

Using quick css f.e. with custom-classes

Using a hidden clip-path svg for that (on the right)

/*** image element with custom-class:  clippy and star ****/

.clippy.star .avia-image-container-inner {
  -webkit-clip-path: polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  clip-path: polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
/*** because the hidden clip-path svg is on the same page - we can use relative path ****/

.clippy.sprechblasen  .avia-image-container-inner   {
   -webkit-clip-path: url(#my-clip-path);
  clip-path: url(#my-clip-path);
}

here is the svg to use as clip-path

<svg class="svg">
  <clipPath id="my-clip-path" clipPathUnits="objectBoundingBox"><path d="M0.417,0 v0 c0.23,0,0.417,0.17,0.417,0.379 s-0.187,0.379,-0.417,0.379 c-0.022,0,-0.044,-0.002,-0.065,-0.005 c-0.089,0.1,-0.193,0.118,-0.296,0.121 v-0.025 c0.056,-0.031,0.101,-0.086,0.101,-0.15 c0,-0.009,-0.001,-0.018,-0.002,-0.026 c-0.094,-0.07,-0.154,-0.176,-0.154,-0.295 c0,-0.209,0.187,-0.379,0.417,-0.379 M0.865,0.85 c0,0.055,0.032,0.102,0.08,0.129 v0.021 c-0.09,-0.002,-0.172,-0.018,-0.249,-0.104 c-0.018,0.003,-0.037,0.004,-0.056,0.004 c-0.083,0,-0.159,-0.025,-0.22,-0.067 c0.126,0,0.244,-0.046,0.334,-0.128 c0.045,-0.041,0.081,-0.09,0.106,-0.144 c0.027,-0.057,0.04,-0.119,0.04,-0.182 c0,-0.01,0,-0.02,-0.001,-0.03 c0.063,0.059,0.102,0.138,0.102,0.226 c0,0.102,-0.052,0.193,-0.134,0.253 c-0.001,0.007,-0.002,0.015,-0.002,0.022"></path></clipPath>
</svg>
AltText for the image