Iconography
One monochrome icon family for the whole tool, shipped in two weights. The thin weight — open line work at 1.6px with round joins — is the default everywhere: it’s the look we picked, and every component and
surface uses it. A filled weight (solid silhouettes + filled-outline marks at
one bold mass) is kept permanently as the alternate and stays one switch away here. The only
icons that never go thin are the brand / platform logos — Krown, Google, Apple and Bing keep
their solid marks. Every glyph inherits currentColor, so an icon
is always exactly one ink and obeys the colour rules the rest of the system already follows.
Icon principles
Four rules keep the set coherent as it grows. The platform marks are the strict case — a live tile fills green to match the Published chip and the rest stay neutral with a status dot; they never reach for brand colour.
Solid objects, bold marks
Objects (trash, gear, pin, calendar…) are filled silhouettes — they read fast and sit with the chunky Krown K. Marks and linear utilities (check, x, plus, minus, search, sort, refresh) are drawn as filled outline paths at one unified ~2.4px bold weight, so they carry the same visual mass — and, like the objects, contain no strokes.
One colour, always
House icons inherit currentColor and knock out detail with even-odd fill, never a second colour. Platform tiles use each company’s official logo, so they stay accurate without becoming a brand-colour rainbow.
Drawn on one grid
24×24 box, ~2px minimum feature, shared optical weight. Directional icons are one base rotated, so a left and a right arrow can never drift apart.
Meaning, paired with words
An icon supports a label or a known control — it rarely stands alone. Status still ships colour + dot + word; the glyph is reinforcement, not the only signal.
The Krown K
Our house mark, traced exactly from the supplied file — vertical stem, detached forward chevron, the signature notch and floating slit. It ships in the icon set as a true vector: monochrome black by default, transitioning to brand orange when active. It anchors the platform row as the first tile (K · G · A · B) and stands in anywhere the brand needs a compact mark.
Traced from the supplied file, tuned for 24px. The exact silhouette — same stem, same forward chevron, same notch — rebuilt as a clean vector so it stays crisp from a 16px tile up to any size. Monochrome by default so it inherits ink like every other glyph, and it recolours to brand orange on the active state.
- Two filled subpaths: a notched stem and a single forward-chevron arm.
- The chevron tips align to the right edge; the notch points back toward the stem.
- A hairline gap separates stem and chevron — the floating-slit detail that makes it the Krown mark.
- Supplied 16-grid silhouette scaled ×1.5 onto the 24-grid, with a consistent optical margin matching the rest of the set.
One path, colour only. Default monochrome ink so the K behaves in the platform row; color: var(--brand) on the active / selected state. Because it
inherits currentColor the transition is a single CSS property —
same as every other icon.
Platform marks
The four destinations a location syncs to: Krown, Google, Apple and Bing. Krown is our own mark; Google and Apple ship in Bootstrap Icons (bi-google, bi-apple) and are mapped directly like every other glyph. Bootstrap has no dedicated Bing icon, so Bing uses the closest available mark — bi-microsoft (Bing is a Microsoft product). Each mark inherits ink. A live platform fills green to match the Published chip; the rest stay neutral and a corner dot names the work left.
All four are true vectors and inherit ink like the rest of the set. Live tiles fill green — a square sibling of the Published chip, no dot. On the rest, a corner dot names the work: amber manual · grey not-set.
Bing → Microsoft mark
Bootstrap Icons includes Google and Apple brand glyphs but no Bing mark.
Since Bing is a Microsoft product, the Bing tile uses Bootstrap’s bi-microsoft — the closest available glyph — so the whole row
stays a consistent set of true vectors with no drop slot to maintain.
Icon library
The starter set for the Design Manager — direction, navigation, status, actions and wayfinding. Enough to build Locations, Intake, Translation and Updates without reaching for anything off-system. The set ships in two weights: the thin line variant — our default everywhere, the look we’re shipping — and the original filled family, kept permanently as the alternate weight. Thin is selected below by default; switch to compare.
Sizing & ink
Use the smallest size that still reads. Icons take the colour of their context — ink for default, status hues only when paired with a status word.
Standard sizes
16px inline with text & in dense tiles · 20px buttons & inputs · 24px default · 28–32px platform tiles & empty states. Never below 14px.
Ink in context
Default ink-900 / ink-500 · status glyphs borrow --ok / --manual / --block only beside a status word, never as standalone colour.
In context
How the glyphs assemble into the components that already exist — buttons, the search field, links and the activity feed.
Krown Design Manager — Icon system · 24-grid, thin 1.6px default with the filled alternate, monochrome. Built on the system’s existing tokens & tiles.