Preskoči na glavni sadržaj
LibraTool logoLibraTool

CSS Grid generator — besplatno

Vizualno kreirajte CSS grid — tragove, jedinice i razmake — i kopirajte generirani CSS i HTML.

Radi offline nakon učitavanja
Predlošci
Stupci (3)
Redovi (2)
Uživi pregled
1
2
3
4
5
6
css
.container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto auto;
  column-gap: 16px;
  row-gap: 16px;
}
html
<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
  <div class="item">5</div>
  <div class="item">6</div>
</div>

🔒 Sve se izvršava u vašem pregledniku — ništa se ne učitava na server.

Kako funkcionira

Vizualno dizajnirajte CSS mrežu: dodajte do 8 stupaca i 8 redaka, postavite svaku traku na fr, px, auto ili min/max-content, i podesite razmake redaka/stupaca. Numerirani pregled uživo trenutačno se ažurira, a generirani grid-template CSS plus odgovarajući HTML udaljeni su jedan klik od vašeg međuspremnika.

  1. 1
    Oblikujte mrežu
    Dodajte/uklonite stupce i retke s + i −.
  2. 2
    Postavite trake
    Svaki stupac i redak dobiva vlastitu jedinicu (1fr, 100px, auto…).
  3. 3
    Podesite razmake
    Zasebni klizači za razmak redaka i stupaca.
  4. 4
    Kopirajte kod
    CSS spreman za produkciju i odgovarajući HTML skelet.

Sve radi u vašem pregledniku — ništa se ne šalje.

Srodni alati

↔️

CSS Flexbox generator

Eksperimentirajte sa flex smjerom, zamatanjem, poravnavanjem i rastezanjem na Live stavkama — i kopirajte CSS.

Isprobajte
📐

Generator CSS clamp()

Generirajte fluidnu CSS clamp() vrijednost za responzivnu tipografiju i razmake. Postavite minimalnu/maksimalnu veličinu i raspon preglednika, pogledajte živi pregled i kopirajte jednolincijski CSS.

Isprobajte
📓

Papir za ispis — crtovlje, kockice, točkice i notni papir (PDF)

Ispišite vlastiti papir: crtovlje (široko ili studentsko), kockice, točkice, izometrijski, za vježbanje rukopisa, notni sustav ili Cornell bilješke, u formatu A4, Letter, A5 ili Legal, bilo koje boje linija, s onoliko stranica koliko trebate. Oštar vektorski PDF izrađen u vašem pregledniku.

Isprobajte

Često postavljana pitanja