Corner smoothing on pills

Corner smoothing in Figma doesn’t seem to work when the radius is 50% or 1/2 the height of the rectangle aka pills or rounded buttons. If you look at Airbnb’s or Apple’s pills, they appear to have a corner smoothing applied. Is there a workaround to get this effect in this scenario or is it something we just need to communicate to engineers when handing off designs?

1 Like

Hey there, thanks for reaching out!

You can apply corner smoothing to any shape you can apply corner radius to. Unlike corner radius, you can only apply corner smoothing to the entire shape.

  1. Select the layer in the canvas or Layers panel.
  2. Open the Design panel in the right sidebar.
  3. Click the Independent corners icon to open the Corner radius panel.
  4. Use the slider to adjust corner smoothing.
  5. Click iOS to set corner smoothing to 60%, the default for iOS.