Generador CSS de border-radius

Ajusta border-radius por esquina o pares de esquinas, cambia unidades y propiedades físicas o lógicas y genera el CSS listo para usar.

Salida CSS

Abreviada Individual

Aplicación

Todos Individual Pares de esquinas

Sistema de propiedades

Las propiedades físicas se aplican directamente a los lados del elemento, mientras que las propiedades lógicas se aplican a los lados del elemento en función de la dirección del texto.

Físicas Lógicas

Unidad

Dirección del texto

Izquierda a derecha (ltr) Derecha a izquierda (rtl)

Todas las esquinas

Superior izquierda

Superior derecha

Inferior derecha

Inferior izquierda

Superior izquierda + inferior derecha

Superior derecha + inferior izquierda

border-radius

HTML

<div class="border-radius"></div>

CSS

.border-radius {
  border-radius: 40px;
}