Generador de Border Radius

Redondea cada esquina con deslizadores, crea formas orgánicas tipo «blob» con el modo elíptico y copia el CSS al instante.

Preajustes
Esquinas
Todas las esquinas
24px
CSS
Ajusta los deslizadores para redondear tus esquinas.

Cada forma se dibuja en tu navegador. Nada de lo que configures aquí se sube a BroBroGo.

Preguntas frecuentes

¿Cómo funcionan las cuatro esquinas y px frente a %?

Los cuatro deslizadores corresponden, en sentido horario, a las esquinas superior izquierda, superior derecha, inferior derecha e inferior izquierda. En píxeles la esquina se redondea una cantidad fija; en porcentaje se redondea según la caja: el porcentaje horizontal sigue el ancho y el vertical sigue el alto, así que al 50% un cuadrado se convierte en círculo.

¿Qué hace el modo elíptico?

Desactivado, cada esquina es un cuarto de círculo con un único radio. Al activarlo, cada esquina recibe un radio horizontal y otro vertical por separado, que es como se crean las formas «blob» suaves y orgánicas. La herramienta escribe por ti la forma de dos valores con barra y vuelve a la forma corta cuando las esquinas son redondas otra vez.

¿Cómo hago un círculo perfecto o una píldora?

Enlaza las esquinas, cambia a porcentaje y pon 50%: un cuadrado se vuelve un círculo. Para un botón tipo píldora, quédate en píxeles y arrastra una esquina más allá de la mitad de la altura del botón; los lados quedan totalmente redondeados a cualquier ancho. El preajuste Círculo deja listo el primer caso con un clic.