Gerador de CSS Flexbox
Crie layouts flex visualmente.
Receitas de layout (10 predefinições)
Configurações infantis selecionadas
Tente também: Gerador de CSS Grid · Gerador de Gradiente CSS · Gerador de Sombra de Caixa CSS.
Crie um layout flex visualmente
Escolha uma receita ou ajuste os controles — a prévia atualiza ao vivo. Copie a regra .container para sua folha de estilos.
Perguntas frequentes
O que ele gera?
Uma regra flex para .container, pronta para copiar, com direção, alinhamento, quebra e gap, além de uma prévia ao vivo com quantidade ajustável de elementos filhos.
O que são receitas de layout?
Dez predefinições de um clique: barra de navegação, hero centralizado, linha de cartões, estrutura com barra lateral, pilha vertical, barra de rodapé e mais — padrões comuns que os desenvolvedores colam diariamente.
Algo é enviado?
Não. O CSS é gerado totalmente no seu navegador.
Última atualização: