# CSS Border Radius Builder

URL: https://phishdestroy.io/developer-tools/border-radius-builder
Category: Misc
Where it runs: Runs locally (nothing you enter is uploaded)

Set each corner's radius in pixels and copy the resulting border-radius declaration; the preview box updates as you type.

## Example input

One rounder corner

```
60
```

Sets the top-left radius: border-radius: 60px 20px 20px 20px;

## FAQ

### In what order are the values written?

Top-left, top-right, bottom-right, bottom-left, the clockwise order CSS uses. All four values are always written, even when they are equal.

### Can I use percentages or elliptical corners?

No. Values are in pixels and each corner gets one radius; for percentages or elliptical corners (the slash syntax, such as 50% / 20%), edit the copied CSS.

### Does it send anything?

No. It runs in your browser.

## Related tools

- [CSS Box-Shadow Builder](https://phishdestroy.io/developer-tools/box-shadow-builder)
- [CSS Gradient Builder](https://phishdestroy.io/developer-tools/css-gradient-builder)
- [Color Converter](https://phishdestroy.io/developer-tools/color-converter)
- [SVG Placeholder Generator](https://phishdestroy.io/developer-tools/svg-placeholder-generator)

All tools: https://phishdestroy.io/developer-tools