POST Design System Using the system
Digital

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

Clicking copies
the snippet needs the sprite on the page; the full SVG stands alone.

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.