Gerador Flexbox CSS
Crie layouts CSS Flexbox visualmente. Ajuste direction, justify-content, align-items, wrap e gap. Copie o código CSS. Grátis, 100% no seu navegador.
Visualização
Saída CSS
Referência
O que é CSS Flexbox?
CSS Flexbox é um modelo de layout unidimensional que organiza elementos em linha ou coluna. Ele simplifica o alinhamento, a distribuição e o dimensionamento dos elementos — sem floats ou posicionamento.
Propriedades principais
flex-direction — define o eixo principal (row, column). justify-content — distribui os elementos ao longo do eixo principal. align-items — alinha os elementos no eixo transversal. flex-wrap — permite a quebra de linha em várias linhas. gap — define o espaçamento entre os elementos.
Privacidade
Todo o processamento é executado 100% no seu navegador. Nenhum dado é enviado a servidores.