Generador de border-radius CSS
Crea esquinas redondeadas en CSS con vista previa en vivo: ajusta cada esquina, activa las cuatro juntas o crea formas orgánicas (blob) con los 8 valores de border-radius.
Generador de border-radius y blob
Generador de border-radius CSS: para qué sirve
Ajusta las cuatro esquinas juntas o por separado, en px o %, y mira cómo cambia la forma al instante. En el modo Blob, usa los radios horizontales y verticales para crear formas orgánicas y genera variaciones aleatorias. El CSS queda listo para copiar.
El código no se envía a ningún servidor: la conversión ocurre en tu navegador.
Cómo usar
- Elige esquinas o blob.
- Ajusta los controles deslizantes.
- Copia el CSS generado.
Cuándo usar
- Crear botones y tarjetas redondeadas.
- Hacer formas orgánicas para fondos.
- Aprender la sintaxis de border-radius.
Preguntas frecuentes
¿Cómo redondear solo algunas esquinas?
Desactiva la opción de esquinas iguales y ajusta cada una. El orden en CSS es superior izquierda, superior derecha, inferior derecha e inferior izquierda.
¿Cómo hacer una forma orgánica (blob)?
Usa el modo Blob: emplea la sintaxis con barra, como 30% 70% 70% 30% / 30% 30% 70% 70%, donde los valores antes de la barra son los radios horizontales y los de después, los verticales.
¿Es gratis de verdad?
Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas y funcionan directo en tu navegador.