Generador de CSS Grid — gratis y en línea

Montar una cuadrícula CSS a mano puede ser lento. Cuentas las pistas, calculas los espacios, escribes el código, recargas la página y vuelves a ajustar. Ayuda mucho ver la cuadrícula mientras la armas. Añadimos una herramienta gratis que lo hace — CSS Grid Generator — directamente en tu navegador.

Qué hace

Creas una cuadrícula CSS de forma visual. Eliges cuántas columnas y filas quieres, añades los espacios entre ellas y defines el tamaño de cada pista — fr, px, auto o el valor que tú escribas. Mientras cambias cosas, ves cómo toma forma el diseño, y la herramienta escribe el CSS correspondiente por ti.

Nada sale de tu dispositivo

Todo funciona en tu navegador. Tu cuadrícula y el código se quedan en tu ordenador — no se sube nada ni se guarda en ningún servidor. Cierras la pestaña y desaparece.

Cómo usarla

  1. Abre CSS Grid Generator y define tus columnas y filas.
  2. Elige el tamaño de cada pista (fr, px, auto o un valor propio) y añade los espacios que quieras.
  3. Copia el CSS que te da y pégalo en tu proyecto.

Es gratis y sin límite. Hay más herramientas pequeñas en la página de Apps.

Recibe los nuevos posts

Pronto podrás dejar tu email y recibir los nuevos posts — sin cuenta, sin spam.

El registro por email aún no está activo — por ahora no se recoge nada.