← Todas las herramientas de texto

Generador de CSS flexbox

Juega con los ajustes de flexbox en cajas en vivo y copia el CSS.

  • Gratis
  • Sin registro
  • Funciona en cualquier dispositivo

Acerca de Generador de CSS flexbox

Cambia flex-direction, wrap, justify-content, align-items y gap en cajas en vivo y mira cómo se mueven los elementos, y luego copia el CSS. Justify-content actúa en el eje principal y align-items en el eje transversal, y estos se intercambian al pasar de fila a columna, lo que confunde a muchos principiantes.

Cómo usar Generador de CSS flexbox

  1. Configura las opciones de arriba. El resultado se actualiza en directo.
  2. Cambia lo que quieras hasta que quede perfecto.
  3. Copia el resultado o descárgalo.

¿Por qué usar esta herramienta?

También conocida como

Preguntas frecuentes

¿Cómo centro un div con flexbox?

En el elemento padre define display: flex, justify-content: center y align-items: center. Dale al padre una altura para que el centrado vertical tenga espacio para funcionar.

¿Es gratis Generador de CSS flexbox?

Sí. Generador de CSS flexbox de Toolipedia es de uso gratuito, sin registro y sin marca de agua.

¿Es seguro usarlo?

Sí. Todo se calcula en tu navegador y nada de lo que introduces se envía a nuestro servidor.

¿Funciona en mi teléfono?

Sí. Funciona en cualquier navegador moderno en Android y iPhone, y también en tabletas y computadoras. No hay que instalar nada.

¿Necesito una cuenta?

No. Solo abre la página y usa la herramienta. No hace falta registrarse ni dar un correo electrónico.

Herramientas relacionadas