Toolipedia
PT
← Todas as ferramentas de texto

Gerador de CSS flexbox

Experimente as configurações de flexbox em caixas ao vivo e copie o CSS.

  • Grátis
  • Sem cadastro
  • Funciona em qualquer dispositivo

Cerca de Gerador de CSS flexbox

Altere flex-direction, wrap, justify-content, align-items e gap em caixas ao vivo e veja como os itens se movem, depois copie o CSS. O justify-content atua no eixo principal e o align-items no eixo transversal, e eles se invertem quando você passa de row para column, o que confunde muitos iniciantes.

Como usar: Gerador de CSS flexbox

  1. Defina as opções acima. O resultado é atualizado ao vivo.
  2. Ajuste o que quiser até ficar do seu jeito.
  3. Copie o resultado ou baixe.

Por que usar esta ferramenta?

Também conhecido como

Perguntas frequentes

Como centralizo uma div com flexbox?

No elemento pai, defina display: flex, justify-content: center e align-items: center. Dê uma altura ao pai para que a centralização vertical tenha espaço para funcionar.

Gerador de CSS flexbox é grátis?

Sim. Gerador de CSS flexbox no Toolipedia é de uso gratuito, sem cadastro e sem marca d'água.

É seguro usar?

Sim. Tudo é calculado no seu navegador, e nada do que você digita é enviado ao nosso servidor.

Funciona no meu celular?

Sim. Funciona em qualquer navegador moderno no Android e no iPhone, além de tablets e computadores. Não é preciso instalar nada.

Preciso de uma conta?

Não. É só abrir a página e usar a ferramenta. Sem cadastro e sem e-mail.

Ferramentas relacionadas