Diseño y color

Generador de esquinas CSS

Generador de esquinas CSS — Elige tamaños o colores y revisa el código o resultado. Los datos de la herramienta quedan en tu dispositivo. Sin cuenta.

Sin cuenta

Cargando herramienta…
Continuar en un espacio de trabajo

Cómo usar

  1. 1Introduce valores y elige las opciones.
  2. 2Ejecuta la herramienta y revisa el resultado.
  3. 3Copia el resultado o cambia los datos para comparar.

A tener en cuenta

Revisa rangos y unidades. Los resultados dependen de los datos y del navegador.

Los anuncios pueden procesar datos de conexión. La personalización respeta tus opciones de privacidad. Privacidad (inglés)

Ejemplo calculado de entrada y salida

Resultados del motor real con los valores de ejemplo, sin datos personales ni trabajos guardados. Carga el ejemplo en la herramienta para ver las mismas entradas.

Entrada de ejemplo

CampoValor
Arriba a la izquierda
24
Arriba derecha (px)
8
Abajo a la derecha
24
Abajo izquierda (px)
8

Resultado de ejemplo

border-radius: 24px 8px 24px 8px;
Requisitos de entrada

Estos son límites reales de validación, no una garantía de que todo valor aceptado sea realista o aplicable a tu caso.

  • Arriba a la izquierda: Rango admitido: 0 ≤ x ≤ 1000
  • Arriba derecha (px): Rango admitido: 0 ≤ x ≤ 1000
  • Abajo a la derecha: Rango admitido: 0 ≤ x ≤ 1000
  • Abajo izquierda (px): Rango admitido: 0 ≤ x ≤ 1000

Herramientas relacionadas

Todas las herramientas