Driftline / icon system
Signals from the edge.
A compact, hand-drawn vocabulary for coastal tide and weather stations — built for calm scanning in changing conditions.
18 symbols · 24 × 24 grid
The row test
Every mark shown at its native 24px size.
Symbol index
Organic, mechanical, and interface forms share one visual grammar.
Scale ramp
No alternate small form is needed: open counters and broad gestures hold at 16px.
16 px
24 px
48 px
96 px
In the station
A realistic dark-mode fragment, using the same symbols as controls and data.
North Spit / 04● Live
1.8 msignificant swell
18 knwest wind
+0.42 mrising tide
Station controls
FiltersLast 24 hours
HistoryCompare previous tide
Thresholds2 active warnings
Construction rules
The small decisions that keep the family together.
Grid
24 × 24 viewBox, with a 2 unit live-area padding. Primary gestures stay between 3 and 21.
Line
1.5 unit stroke, round caps and joins. Curves use broad three- or four-point gestures, never texture.
Optics
Circles sit slightly inside squares; dense mechanical details are kept open so all marks carry equal visual weight.
Usage
Decorative instances are hidden; informative instances are named.
<svg aria-hidden="true" class="icon"> <use href="#swell"></use> </svg> <svg class="icon" role="img" aria-label="Rising tide"> <use href="#tide"></use> </svg>