Generador de layout CSS Flex

Preajustes

Dirección del eje principal

Ajuste de línea

Alineación del eje principal

Alineación del eje cruzado

Espacio px

Salida CSS

Ajusta Flexbox de forma visual. Aplica presets, vista previa en vivo y copia CSS.

16 presets: fila/columna, center, space-between/evenly, wrap, navbar, reverse, baseline…
Controles: flex-direction, flex-wrap, justify-content, align-items, gap
Ítems de colores muestran la alineación con claridad
Exporta CSS display:flex listo para pegar