Developer ToolsCSS ToolsFree Tool
Border Radius Generator
Build a real border-radius CSS declaration — a single value applied uniformly, plus the equivalent per-corner syntax.
How to Use Border Radius Generator
- 1Enter a pixel value (default 8)
- 2Click Process
- 3Copy the shorthand or per-corner border-radius CSS
Frequently Asked Questions
Two equivalent forms of the same value: the shorthand border-radius: Xpx; and the explicit 4-corner border-radius: Xpx Xpx Xpx Xpx; (top-left, top-right, bottom-right, bottom-left) — both use whatever value you enter.
Not directly through this tool's single input — it applies one value uniformly to all 4 corners in both output lines. Manually edit the per-corner line after copying if you need different values per corner.
Pixels (px) — enter just the number, the unit is added automatically.
No — the CSS is built entirely in your browser.
Related Tools
CSS Minifier
A developer-tools-side CSS minifier — strips comments, collapses whitespace, and trims spacing around punctuation, part of ToolHive's CSS/SCSS/LESS toolset alongside the beautifier and preprocessor converters.
CSS Beautifier
Reformat minified or messy CSS with a newline after each rule, selector, and declaration — the same logic as the CSS Prettifier tool.
CSS to SASS
Get a lightly restructured starting point for SCSS conversion — not a real CSS-to-SCSS transpiler with nesting or variable extraction.
SASS to CSS
Get a basic structural cleanup of SASS/SCSS — not a real Sass compiler. Variables and nesting are not resolved.