Khoa Nguyen
Pressure creates diamonds
Skip to main content

The math of border-radius

Last updated: 23 May 2023 (1 year ago)

The calculation

innerRadius = outerRadius - gap 

CSS

--outer-radius: 1em;
--padding: 0.5em;
--inner-radius: calc(var(--outer-radius) - var(--padding));
  • E-commerce
  • Landing page
  • Usability
  • Accessibility
  • Information Architecture
  • Responsive Design