CSS Generators

A flower shape using CSS mask

Number of petals(12)
Rotation
.box {
  width: 200px;
  aspect-ratio: 1;
  --g:/20.56% 20.56% radial-gradient(#000 calc(71% - 1px),#0000 71%) no-repeat;
  mask: 100% 50% var(--g),93.3% 75% var(--g),75% 93.3% var(--g),50% 100% var(--g),25% 93.3% var(--g),6.7% 75% var(--g),0% 50% var(--g),6.7% 25% var(--g),25% 6.7% var(--g),50% 0% var(--g),75% 6.7% var(--g),93.3% 25% var(--g),radial-gradient(100% 100%,#000 38.37%,#0000 calc(38.37% + 1px));
}
Support This Project
?