CSS Border Radius

Shape CSS corners with a live preview.

• Design
• css
• radius
• design

About

Build a CSS `border-radius` with four corner values. Inputs: `tl`, `tr`, `br`, `bl` (px). Returns the CSS declaration.

Parameters

Examples

• A card with 20px rounded corners.

Use it

In the browser: https://mcp.gholl.com/embed/border-radius

As an AI tool: call border-radius on the MCP endpoint https://mcp.gholl.com/mcp.

{
  "mcpServers": {
    "gholl": {
      "type": "http",
      "url": "https://mcp.gholl.com/mcp"
    }
  }
}

Related tools

• Color Studio & Contrast — Convert between hex/RGB/HSL, generate tints and shades, and check WCAG contrast against black and white.
• CSS Gradient Generator — Design a CSS gradient with a live preview and copy-ready code.
• CSS Box Shadow — Build a CSS box-shadow with a live preview.
• Color Palette — Generate a harmonious palette from a base color.
• Color Blindness Simulator — Preview a color under different color-vision deficiencies.
• QR Code Generator — Generate a QR code from text or a URL.
• Image to Base64 — Convert an image to a data URI / Base64.
• Image Compressor — Compress an image in the browser.
• Favicon Generator — Turn text or an emoji into a favicon.