v155 · corner shorthands

Corner builder

Set each corner independently and watch the rule collapse: four matching corners become one corner declaration, a matching pair becomes an edge shorthand, and anything else falls back to per-corner. The longhand table underneath is read from the computed style, so it shows what the shorthand actually set.

Build

preview

The shortest rule that expresses this

Computed longhands, read back from the element
cornerborder-radiuscorner-shape

see also