LibraTool logoLibraTool

Gjenerues Rrjeti CSS Falas

Dizajno vizualisht një rrjet CSS — shina, njësi dhe zbrazëtira — dhe kopjo CSS-në dhe HTML-në e gjeneruar.

Funksionon jashtë linje sapo ngarkohet
Paracaktime
Kolona (3)
Rreshta (2)
Pamje paraprake e drejtpërdrejtë
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>

🔒 Gjithçka funksionon në shfletuesin tënd — asgjë nuk ngarkohet.

Si funksionon

Dizajno një grid CSS vizualisht: shto deri 8 kolona dhe 8 rreshta, vendos çdo trak te fr, px, auto, ose min/max-content, dhe rregullo hapësirat e rreshtave/kolonave. Parashikimi i drejtpërdrejtë i numëruar përditësohet menjëherë dhe CSS-ja grid-template e gjeneruar plus HTML-ja përkatëse janë me një klikim nga clipboard yt.

  1. 1
    Formo rrjetin
    Shto/hiq kolona dhe rreshta me + dhe −.
  2. 2
    Vendos traket
    Çdo kolonë dhe rresht merr njësinë e vet (1fr, 100px, auto…).
  3. 3
    Rregullo hapësirat
    Rrëshqitës të veçantë për hapësirën-e-rreshtit dhe hapësirën-e-kolonës.
  4. 4
    Kopjo kodin
    CSS gati-për-prodhim dhe skeleti HTML përkatës.

Gjithçka funksionon në shfletuesin tënd — asgjë nuk ngarkohet.

Mjete të ngjashme

↔️

Gjenerues CSS Flexbox

Eksperimento me drejtimin flex, mbështjelljen, justifikimin dhe rreshtimin në elemente të drejtpërdrejta — dhe kopjo CSS-në.

Provojeni
📐

Gjenerues CSS clamp()

Gjeneroni një vlerë CSS clamp() fluide për tipografi dhe hapësira përgjegjëse. Vendosni madhësinë min/max dhe intervalin e viewport-it, shihni parashikim të drejtpërdrejtë dhe kopjoni CSS-në me një rresht.

Provojeni
🧾

Gjenerues Faturash

Krijoni një faturë profesionale dhe shkarkoni një PDF të pastër — zëra rreshtash, taksa, zbritje, shumë monedha. Pa regjistrim, pa ngarkim, skica ruhet lokalisht.

Provojeni

Pyetjet e bëra më shpesh