best
Gerador de CSS Grid — best
Gere código de layout CSS Grid visualmente.
1
2
3
4
5
6
display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); column-gap: 16px; row-gap: 16px;
How to use Gerador de CSS Grid
1
Passo 1: Escolha Seu Layout de Grid
Selecione o número de linhas e colunas para seu layout de grid. Você pode escolher entre vários templates pré-desenhados ou criar um layout customizado do zero.
2
Etapa 2: Adicionar Grid Items
Arraste e solte os itens da grid no seu layout para criar um design visualmente atraente. Você pode ajustar o tamanho, cor e posição de cada item conforme necessário.
3
Passo 4: Gerar código CSS
Após ter criado seu layout de grid, clique no botão 'Generate CSS' para receber um código CSS personalizado que você pode copiar e colar no seu arquivo HTML.