CSS Generators

A Random Wavy Divider using shape()

Side
Size of the wave
Granularity
Shape ID
.wavy {
  clip-path: shape(from 0 0,vline to calc(100% - 25px),curve to 4.17% calc(100% - 15.5px) with 2.78% calc(100% - 15px),smooth to 6.94% calc(100% - 9px),smooth to 9.72% calc(100% - 20px),smooth to 12.5% calc(100% - 44px),smooth to 15.28% calc(100% - 27.5px),smooth to 18.06% calc(100% - 20.5px),smooth to 20.83% calc(100% - 23.5px),smooth to 23.61% calc(100% - 10.5px),smooth to 26.39% calc(100% - 5.5px),smooth to 29.17% calc(100% - 9.5px),smooth to 31.94% calc(100% - 11.5px),smooth to 34.72% calc(100% - 20px),smooth to 37.5% calc(100% - 23px),smooth to 40.28% calc(100% - 28px),smooth to 43.06% calc(100% - 24.5px),smooth to 45.83% calc(100% - 25.5px),smooth to 48.61% calc(100% - 44.5px),smooth to 51.39% calc(100% - 31px),smooth to 54.17% calc(100% - 26.5px),smooth to 56.94% calc(100% - 23.5px),smooth to 59.72% calc(100% - 13.5px),smooth to 62.5% calc(100% - 26.5px),smooth to 65.28% calc(100% - 41px),smooth to 68.06% calc(100% - 28.5px),smooth to 70.83% calc(100% - 7.5px),smooth to 73.61% calc(100% - 12.5px),smooth to 76.39% calc(100% - 27.5px),smooth to 79.17% calc(100% - 28px),smooth to 81.94% calc(100% - 27px),smooth to 84.72% calc(100% - 34px),smooth to 87.5% calc(100% - 28px),smooth to 90.28% calc(100% - 31px),smooth to 93.06% calc(100% - 37px),smooth to 95.83% calc(100% - 23.5px),smooth to 100% calc(100% - 25px),vline to 0, hline to 0);
}
Support This Project