Conversor de colores
Convierte HEX, RGB y HSL con transparencia, previsualiza el color y copia valores CSS listos para usar.
Generador de bordes redondeados CSS
Ajusta las cuatro esquinas juntas o por separado, previsualiza radios elípticos y exporta border-radius.
Esquinas elípticas
Vista previa
CSS
Acerca de esta herramienta
Compara esquinas circulares y elípticas para botones, tarjetas o insignias.
Cómo se usa
Elige px o % y mueve los controles o escribe los radios de las cuatro esquinas. Al principio están vinculadas; desvincúlalas para editar cada una. En las opciones elípticas puedes activar radios verticales independientes para separar la curvatura horizontal de la vertical.
Se admiten valores de 0–500 px o 0–100 %. La vista previa y el border-radius que copies o descargues usan los mismos números. Los porcentajes dependen de las dimensiones del elemento. Cambiar de unidad cambia la interpretación de los valores, sin mantener necesariamente el mismo tamaño visual.
Preguntas frecuentes
¿Qué significa la barra de border-radius?
Antes van los radios horizontales y después los verticales. CSS reduce proporcionalmente los radios que se solapan para que encajen en la caja.
¿Por qué 50% produce un óvalo en lugar de un círculo?
Los radios porcentuales se calculan por separado a partir del ancho y del alto. Con 50%, una caja rectangular se convierte en elipse; para obtener un círculo, ancho y alto deben ser iguales. Usa píxeles si necesitas radios fijos y comprueba el CSS con las dimensiones reales del elemento.
Herramientas relacionadas
Se abre en una pestaña nueva
Comentarios
0