Skip to content
Brentwell Digital
Parameter 07 · ShapeSurfaceGrade B

Where the category rounds, we cut.

Radius is 0. A corner is either square or chamfered at 45°, top-right. The geometry of the mark, carried into every button, card, field and marker.

Published 7 September 2026 · sources at the end

The rule

Pick one corner language and keep it everywhere: buttons, cards, fields, panels, photographs. Exception: none. Consistency is the whole point, because shape is one of the three parameters a buyer reads as personality before reading a word.

The mechanism

Angular shapes read as durable and precise; circular shapes read as comfortable. The effect runs through visuospatial imagery rather than through taste, and it interacts with commitment: rounding a high-commitment brand evaluates negatively (Jiang et al., 2016). For a studio whose target is competence, the angular reading is the right one.

The second mechanism is attribution. The Brentwell mark is built from 45° cuts. A brand that rounds what its logo cuts looks unsure of itself; a brand that repeats the cut in its buttons and cards lets the mark's geometry do recognition work on every surface, not just in the header.

The category

Across the 23 sites in the reference portfolio the radius census reads: pill 9, soft 5, tight 4, square 3, inconsistent 1, not applicable 1. Radius, not colour, is what separates those systems. Professional services sits tight. Brentwell deviates deliberately, and this page is the defence.

How we apply it

One radius token, and it is 0. Three chamfer sizes: 8 px on buttons and fields, 12 px on cards and panels, 4 px on the navigation marker. The cut is a clip-path, so a border cannot survive it; borders on chamfered surfaces are inset box-shadows instead.

--bw-radius: 0px;              /* the only radius token */
--bw-chamfer: 8px;             /* buttons · fields */
--bw-chamfer-card: 12px;       /* cards · panels */
--bw-chamfer-mark: 4px;        /* nav marker */
--bw-cut: polygon(0 0, calc(100% - var(--bw-chamfer)) 0,
          100% var(--bw-chamfer), 100% 100%, 0 100%);

.bw-card { clip-path: var(--bw-cut-card);
           box-shadow: inset 0 0 0 1px var(--bw-border); }
8 px
12 px
4 px

What it costs

Comprehension, a little, with buyers who expect the category's soft corners; and one week rebuilding our own template so that every component took the cut from the token rather than from a per-element setting. The governance rule that follows: a new corner treatment is an amendment to the system, not a component style.

Sources

  1. Jiang, Y., Gorn, G. J., Galli, M., & Chattopadhyay, A. (2016). Does your company have the right logo? How and why circular- and angular-logo shapes influence brand attribute judgments. Journal of Consumer Research. Grade B.
  2. The Parameter Series, Volume III: 23 Design Systems, 18 Parameters Each. Radius census, values re-verified 1 September 2026.
  3. Brentwell Digital, Design System 1.0, Parameter 07. brentwell-tokens.css, 1 September 2026.