Saltar al contenido

Generador de Border Radius CSS

Genera valores de border-radius CSS con vista previa en tiempo real. Ajusta cada esquina individualmente o enlázalas. Código CSS listo para copiar. 100% en tu navegador.

Vista previa

12px
12px
12px
12px
Unidad

Código CSS

 

¿Qué es border-radius?

La propiedad border-radius de CSS permite redondear las esquinas de un elemento. Acepta de uno a cuatro valores que definen el radio de cada esquina, creando desde rectángulos ligeramente redondeados hasta círculos perfectos.

Sintaxis

border-radius acepta de 1 a 4 valores. Con un valor, todas las esquinas son iguales. Con cuatro valores, se aplican en orden: superior-izquierda, superior-derecha, inferior-derecha e inferior-izquierda. Se puede usar px, %, em u otras unidades CSS.

Bordes elípticos

Se pueden crear esquinas elípticas usando la sintaxis con barra (/), que define radios horizontales y verticales distintos. Por ejemplo: border-radius: 50% 50% / 30% 70% crea formas orgánicas y asimétricas.

Privacidad

Todo el procesamiento se ejecuta 100% en tu navegador. No se envían datos a ningún servidor.