Générateur de CSS Grid — gratuit en ligne

Construire une grille CSS à la main peut être long. On compte les pistes, on devine les espaces, on écrit le code, on recharge la page, puis on réajuste. Voir la grille pendant qu'on la construit aide beaucoup. Nous avons ajouté un outil gratuit qui fait ça — CSS Grid Generator — directement dans votre navigateur.

Ce qu'il fait

Vous construisez une grille CSS de façon visuelle. Vous choisissez le nombre de colonnes et de lignes, vous ajoutez les espaces entre elles et vous définissez la taille de chaque piste — fr, px, auto ou la valeur que vous tapez. Pendant que vous modifiez, vous voyez la mise en page prendre forme, et l'outil écrit le CSS correspondant pour vous.

Rien ne quitte votre appareil

Tout fonctionne dans votre navigateur. Votre grille et le code restent sur votre ordinateur — rien n'est envoyé ni enregistré sur un serveur. Vous fermez l'onglet et tout disparaît.

Comment l'utiliser

1. Ouvrez CSS Grid Generator et définissez vos colonnes et vos lignes.
2. Choisissez la taille de chaque piste (fr, px, auto ou une valeur personnelle) et ajoutez les espaces souhaités.
3. Copiez le CSS obtenu et collez-le dans votre projet.

C'est gratuit et sans limite. D'autres petits outils vous attendent sur la page Apps.