DevToolBoxGRATIS
Blog

CSS Border Radius Generator โ€” Visual Corner Editor

Design CSS border-radius with independent control for each corner. Live preview, presets, and instant CSS code output.

12px
12px
12px
12px
#3b82f6
CSS Output
border-radius: 12px;
๐• Twitterin LinkedIn

Nilai alat ini

3.6 / 5 ยท 204 penilaian

Alat Lainnya

๐Ÿ”ฒBox Shadow Generator๐ŸŒˆCSS Gradient Generator๐Ÿ“Flexbox Generator{ }CSS Minifier / Beautifier

Recommended

Tailwind UIBeautiful UI components

Tetap Update

Dapatkan tips dev mingguan dan tool baru.

Tanpa spam. Berhenti kapan saja.

Enjoy these free tools?

โ˜•Buy Me a Coffee

How to Use

  1. Adjust sliders for each corner
  2. Toggle link mode to sync all corners
  3. Choose your preferred unit (px, %, em)
  4. Preview the shape in real-time
  5. Copy the CSS code

Use Cases

  • Rounding card corners
  • Creating pill-shaped buttons
  • Making circular avatars
  • Designing organic blob shapes

FAQ

Can I control each corner independently?
Yes, each corner has its own slider. You can also link them to move together.
What presets are available?
Circle, rounded, pill, and blob shapes are included as presets.