Icons
One drawing grid, one stroke weight, and no colour of their own - an icon takes the colour of whatever holds it.
Every glyph declares fill="currentColor", so an icon inside a filled button turns the button's text colour with no second variant. Drop the sprite onto the page once, then reference a glyph by name.
<!-- once per page --> <!-- paste the contents of assets/icons.svg here --> <!-- then, anywhere --> <svg class="post-icon" aria-hidden="true"> <use href="#post-icon-search"/> </svg>
The set 51 glyphs
Click an icon to copy it, or use the arrow in its corner to download the SVG. Downloaded files carry a solid fill so they open visibly in a design tool; the sprite versions use currentColor so they take the colour of whatever holds them.
Download all icons (SVG)Download the sprite
Wayfinding 10
Building navigation and access — the map/signage set, POST's origin story for icons. These pair with the icon-circle display treatment.
Verticals 7
POST's destinations and uses — one per sub-brand activity. Not the same thing as the sub-brand colour axis: an eat page can still show a shop icon.
Atriums 3
The three atrium letters. A POST-specific set with no equivalent elsewhere in the system — they name real places in the building, which is why they are their own group rather than wayfinding glyphs.
Information 11
Time, place and detail — event and status metadata. `warning` pairs with feedback/warning; `info` with the Note Link component. `location` is the place marker, `pin` the saved/pinned one.
Navigation 5
Directional and view controls. `arrow-up-right` is the outbound/external one; the four cardinals are in-page movement.
Actions 9
UI verbs and affordances. `expand`/`collapse` are one chevron rotated 180deg in code; `open`/`close` are one + rotated 45deg. The icon describes what happens to the page, not what the widget is called.
Media 6
Playback and sound. Split from Actions because these carry TRANSPORT state — a player is either playing or it is not — while an action fires and is done.