Line Grid
What this grid is
A Line Grid is a set of evenly spaced vertical and horizontal lines. It is a neutral structure for alignment, drafting, and layout. Use it as a subtle background guide or as a visible design element.
Key parameters
- Columns / Rows — Grid density. More cells means tighter spacing and more lines.
- Spacing X / Spacing Y — Distance between neighboring lines. Smaller spacing gives a denser grid.
- Output size (W×H) — Canvas size for export. Larger output gives more working area at the same density.
- Stroke width — Line thickness. Thin strokes feel technical; thicker strokes read better at small sizes.
- Opacity — Visual strength. Lower opacity is better for background guides.
- Color — Contrast against your background. Light gray is common for guide grids.
Unique highlights
- Independent control on both axes. Useful for rectangular cells.
- Predictable geometry. Straight lines only.
- Good base layer. Works under other patterns.
- Clean export. Stays editable in vector tools.
Typical use cases
- UI layout and spacing guides.
- Typography studies and baseline alignment.
- Drafting underlay for diagrams and technical drawings.
- Print templates (worksheets, planners, guides).
- Subtle background structure behind content.
Tips
- If the grid is too strong, reduce opacity first.
- If lines disappear at small sizes, increase stroke width slightly.
- For a square-grid look, keep Spacing X = Spacing Y.
- For layout grids, use different X and Y values.
FAQ
Does this export as SVG?
Yes. The output is a vector SVG and remains editable.
Spacing vs Columns/Rows — which should I use?
Both affect density. Use spacing for direct distance control. Use columns/rows for a target cell count.
How do I make the grid subtle?
Lower opacity and use a light gray line color.
Why does the preview look different from export?
Preview is scaled to fit your screen. Export keeps the exact output size.
Can I use different spacing in X and Y?
Yes. That creates rectangular cells and is common in layout systems.
Is this suitable for print?
Yes. Use a clear output size and moderate stroke width.