DWG · 02.02 · COMPONENT SPEC

Hatch

A filled region rendered with drafting hatching. Use it anywhere you would reach for a solid fill but want it to look like a section cut on a drawing — for empty states, loading skeletons, or just decorative panels.

Densities

02.02·A
PREVIEWPX · 1:1
45° · 7PX
45° · 4PX
±45° · 7PX
<Hatch className="aspect-square border border-rule" />
<Hatch density="dense" className="aspect-square border border-rule" />
<Hatch density="cross" className="aspect-square border border-rule" />

As an empty state

02.02·B
PREVIEWPX · 1:1
NO DATA · AWAITING SURVEY
<Hatch className="flex h-32 items-center justify-center border border-rule">
  <Annotation>NO DATA · AWAITING SURVEY</Annotation>
</Hatch>