Generador CSS border-radius
Crea el atajo border-radius a partir de valores por esquina, con esquinas elípticas y equivalente de Tailwind.
Generador CSS border-radius
Define el radio en cada esquina y esta herramienta ensambla el CSS border-radius correcto, comprimido al atajo válido más corto: un valor cuando las cuatro esquinas coinciden, dos o tres cuando las esquinas opuestas se repiten, y la lista completa de cuatro valores cuando cada esquina es diferente. Fue diseñada para quien diseña tarjetas, botones, avatares, modales o campos de entrada y quiere CSS limpio y copiable sin hacer matemáticas manual de esquinas.
Elige "Igual en todas las esquinas" para un rectángulo redondeado simple, o cambia a "Esquinas separadas" para ajustar cada esquina independientemente en px, porcentaje o rem. Activar esquinas elípticas añade la notación de barra de ocho valores que border-radius soporta: un radio horizontal y un radio vertical distinto por esquina, controlados por un deslizador de proporción, para que una squircle o una forma de píldora aplanada requiera un arrastre en lugar de ocho campos. La opción "Gota orgánica aleatoria" genera una forma asimétrica fresca en cada ejecución, el tipo de contorno suave e irregular usado detrás de imágenes hero y gotas decorativas. Cambia la salida entre el atajo border-radius y las cuatro propiedades border-*-radius expandidas, y activa la opción Tailwind para obtener la clase de utilidad de valor arbitrario coincidente junto con el CSS plano.
Los valores se validan mientras escribes: los números negativos se tratan como cero y no hay estado que produzca CSS roto. El conteo en vivo bajo la salida informa cuántas líneas de declaración se generaron, cuántos valores de esquina distintos se comprimieron al atajo, y el recuento exacto de caracteres, actualizando cuando ajustas cualquier opción.
Todo se ejecuta localmente en tu navegador: ningún valor de esquina ni CSS generado se envía nunca a ningún lado. Copia el resultado, descárgalo como archivo .txt, o envíalo directamente a la entrada de otra herramienta para seguir trabajando en él.