Border radius

What is the border-radius for these four corners?

Four corners into one declaration, with the inner radius worked out for you - the number a nested element needs so its curve stays concentric with the one outside it.

top left top right bottom right bottom left padding to the inner box

12px All four equal, so the short form is the whole declaration.

ready to paste

border-radius: 12px;

inner radius, 8px in keeps the two curves concentric 4px
as a pill 12px / 50%
logical properties border-start-start-radius: 12px

how to use it

Set each corner in pixels; equal values collapse to the short form.
Copy the declaration.
If something sits inside this box with a border, use the inner radius row.

what this page cannot do

The extension reads the radii a live page uses, which is how you find the card whose inner corner is 8px inside an outer 8px and reads as a dent.

Site styles in the panel Can I keep a CSS fix for one site and have it come back?

Add LoupeKit

TWO BUILDS 9 browsers

Chrome from the Chrome Web Store Firefox from addons.mozilla.org Edge from Microsoft Edge Add-ons Brave takes the Chrome build Opera takes the Chrome build 4 more the Chrome build

no host permissions · the reading is free