css-shapes

Wavy shape with css

孤街浪徒 提交于 2019-11-25 21:50:11
I'm trying to recreate this image with CSS: I would not need it to repeat. This is what I started but it just has a straight line: #wave { position: absolute; height: 70px; width: 600px; background: #e0efe3; } <div id="wave"></div> Cameron A I'm not sure it's your shape but it's close - you can play with the values: https://jsfiddle.net/7fjSc/9/ #wave { position: relative; height: 70px; width: 600px; background: #e0efe3; } #wave:before { content: ""; display: block; position: absolute; border-radius: 100% 50%; width: 340px; height: 80px; background-color: white; right: -5px; top: 40px; } #wave