Appearance → Customize → Style → Button border radius. A slider, from square to pill. Default Square.
The stops
0 (Square) · 2px · 4px · 6px · 8px · 12px · 16px · 24px · 999px (Pill)
It is a slider rather than a dropdown because a radius is judged by looking at it. Drag with the preview open.
What it covers
Every button the theme draws, from one value:
- The header button
- The core Button block in your content
- The search button, the comment submit button, and every other form button
One token, so they cannot drift apart. A site whose header button is a pill and whose comment button is square looks like two sites.
Choosing
| Square | the default. Editorial, serious, and the right answer for most news sites |
| 2–6px | barely rounded. Softens the edge without announcing itself; the safe middle |
| 8–16px | visibly rounded. Reads as an app or a product site |
| 24px, Pill | a marketing button. Fine on a Subscribe, out of place on a form |
The rule of thumb that holds: match the radius to your images. If your thumbnails are square-cornered — and in Stoat they are — square or near-square buttons agree with them.
Not covered
Inputs, images, and the thumbnail figures keep their own corners. If you want those rounded too, Additional CSS:
.entry-thumbnail img,
.search-field { border-radius: 6px; }
