ToolHop.

ADVERT

🟦 Border Radius

Tune each corner radius visually and copy the CSS value.

Border Radius Generator

Adjust corners visually and copy the generated border-radius CSS.

Top-left16px
Top-right16px
Bottom-left16px
Bottom-right16px
border-radius: 16px 16px 16px 16px;

Design ideas

  • Test asymmetrical corners to create playful cards or CTA buttons.
  • Combine with gradients or shadows for glassmorphism layouts.
  • Use the linked toggle to mimic system design tokens such as `--radius-md`.

Practical tips

  • Copy the CSS snippet directly into Tailwind overrides or inline styles without additional formatting.
  • Reset before exploring new shapes to avoid inheriting previous corner values in your prototypes.
  • For responsive layouts, pair the numeric values with percentages to create pill shapes that scale.

ADVERT

More like this

📘YAML Formatter

Format YAML, convert between YAML and JSON, and validate syntax instantly in your browser with offline support.

🔓JWT Decoder

Decode JWT header and payload safely in your browser. Inspect claims and structure without sending tokens anywhere.

🔑JWT Generator

Create signed JSON Web Tokens with customizable headers and payloads. Choose HS256, HS384, or HS512 HMAC algorithms and copy the ready-to-use JWT.

🛠️Cron Expression Builder

Visually craft cron expressions with presets, interval selectors, and quick toggles. Copy the expression and preview the next scheduled runs instantly.

🕰️Cron Parser

Parse cron expressions and preview next run times. Useful for devs managing scheduled tasks and crontab jobs.

🔏HMAC Generator

Compute HMAC signatures with SHA-256, SHA-1, or MD5 using a secret key. Secure online hashing tool.

🧪Regex Tester

Test and debug JavaScript regular expressions. Highlight matches and quickly verify regex patterns.

🧩Regex Pattern Builder

Compose regular expressions with guided toggles for character sets, anchors, quantifiers, and flags. Test against sample input instantly.

ADVERT