Border-shape: the future of the non-rectangular web

Speech bubble with “border-shape: the future of the non-rectangular web” above a row of pieces: pentagon, hexagon, square, triangle, circle, star, trapezoid.

Una Kravets introduces border-shape, an upcoming CSS property that redefines an element’s box so the background, border image, focus outline, and box shadow follow the same custom geometry. It’s already in Chrome Canary ready for testing.

una.im/border-shape