You have been using border-radius since 2010. It gives you round corners. That is it. One shape. Forever. CSS just shipped a new property called corner-shape , and it changes the whole game. Same border-radius you already know, but now you control the shape of that corner. Round, flat, scooped inward, notched sharp, six shapes out of the box. ⚠️ Heads up: This is experimental and currently only supported in Chrome Canary (behind a flag). Always check browser compatibility before shipping. The one rule to remember corner-shape does nothing without border-radius . Think of it like this: border-radius draws the corner area, and corner-shape decides what lives inside it. /* This does nothing */ corner-shape : scoop ; /* This works! */ border-radius : 30 px ; corner-shape : scoop ; Enter fullscreen mode Exit fullscreen mode All 6 shapes, explained Here are all the keyword values you can use: Value What it looks like round The classic smooth curve. Default behavior.…