The corner-shape CSS property defines geometric shapes for element corners beyond standard rounded edges. It works with border-radius to create various corner styles including rounded, squared, beveled, notched, scooped, and squircle shapes. The property supports individual corner customization through physical and logical directional properties, accepts the superellipse() function for custom curves, and can be animated or transitioned. Currently in CSS Borders and Box Decorations Module Level 4 Editor's Draft, it enables creative corner designs while automatically handling corner collisions.
Sort:
