▦
Generador CSS Grid
Diseña una cuadrícula CSS con columnas, filas y gap y copia el código resultante.
1
2
3
4
5
6
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;Cómo funciona
Ajusta el número de columnas, filas y separación. La herramienta actualiza la vista previa y genera las propiedades display, grid-template-columns y gap.
Preguntas frecuentes
¿Las columnas son responsivas?
El código generado usa unidades fr para repartir el espacio disponible entre las columnas.
¿Puedo copiar el CSS?
Sí. El código se genera automáticamente y puede copiarse con un botón.