▦
Gerador CSS Grid
Crie uma grade CSS com colunas, linhas e gap e copie o código resultante.
1
2
3
4
5
6
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;Como funciona
Ajuste o número de colunas, linhas e o espaçamento. A ferramenta atualiza a prévia e gera as propriedades display, grid-template-columns e gap.
Perguntas frequentes
As colunas são responsivas?
O código gerado usa unidades fr para distribuir o espaço disponível entre as colunas.
Posso copiar o CSS?
Sim. O código é gerado automaticamente e pode ser copiado com um botão.