Skip to content
utils.sbs

Color & Design tool

Border Radius Generator

Design custom rounded corners and copy the CSS.

Runs on-deviceNo sign-upFree
All color & design tools

Border Radius Generator workspace

Workspace

Border Radius Generator

Runs locally
px
px
px
px

Screen-accurate enough

Values are calculated on the fly. CMYK is an approximation for screen preview; use a colour-managed proof for print.

border-radius
Values & CSS0 chars

The guide

By the utils.sbs team · Reviewed November 2026 · How we build and review tools

Quick answer

Border Radius Generator is a free browser-based color & design tool. Design custom rounded corners and copy the CSS. It runs with JavaScript and Canvas colour conversions locally, requires no account and does not upload your files. Open the page, add your input, adjust any options and download the result.

What is Border Radius Generator?

Border Radius Generator is a free browser-based color & design tool from utils.sbs. Design custom rounded corners and copy the CSS. It is built for quick, focused jobs: open the page, add your input, adjust the options and take the result with you. No account, install or server upload is required.

At a glance

CategoryColor & Design
InputHEX, RGB or HSL values, or an image for colour sampling
OutputCSS, JSON or a generated colour palette
EngineJavaScript and Canvas colour conversions
ProcessingIn your browser
PriceFree
AccountNot required

How Border Radius Generator works

Colour values are converted with standard colour-space formulas and generated as CSS, design tokens or image palettes.

How to use Border Radius Generator

  1. 1Open Border Radius Generator and add your input.
  2. 2Adjust the options: top left, top right, bottom right, bottom left.
  3. 3Run the tool, check the preview or result, and download the output.

When to use Border Radius Generator

  • Build a palette for a website or design system.
  • Convert colour values between HEX, RGB and HSL.
  • Check contrast or sample colours from an image.

Inputs and options

Top left
Enter a numeric value in px.
Top right
Enter a numeric value in px.
Bottom right
Enter a numeric value in px.
Bottom left
Enter a numeric value in px.

Limitations

Screen colour and colour-space differences can change how values appear on other devices.

Privacy and accuracy

Border Radius Generator processes its input in the browser whenever the platform API allows it. Files and values are not uploaded to a server for processing, and the tool does not require an account. For calculations, use the result as a reference and verify important decisions against the source formula or a qualified professional. Read our methodology.

FAQ

Border Radius Generator questions

  • What can I do with Border Radius Generator?

    Design custom rounded corners and copy the CSS. Border Radius Generator is part of the Color & Design shelf on utils.sbs and is designed for quick, one-off tasks.

  • Is Border Radius Generator free to use?

    Yes. Border Radius Generator is free, requires no account, and has no per-file or per-use charge.

  • Are my files uploaded when I use Border Radius Generator?

    No. Border Radius Generator is designed to process your input locally in the browser. Files are not uploaded to a server for processing.

  • What formats does Border Radius Generator support?

    It accepts colour values and returns CSS, JSON or a generated palette that you can copy or download.

  • Can I use Border Radius Generator on my phone?

    Yes. Border Radius Generator is responsive and works in modern mobile browsers. Very large files may be limited by the device's available memory.

Keep going

Related color & design tools

All color & design tools