Style guide (internal)

Tokens, type, components and states used across this design. This page carries a noindex meta tag and is not part of the public navigation.

Colour tokens

pn/navy

#22334A

pn/ink

#1B222B

pn/slate

#4B5560

pn/stone

#5E656E

pn/brass-deep

#8A6420

pn/brass

#A87B2D

pn/sage

#5F7146

pn/rust

#A9482F

pn/paper

#F7F4EE

pn/bone

#EDE7DC

pn/linen

#DDD3C2

pn/navy-deep

#182636

Type scale

Display XL / Newsreader 56

Display L / Newsreader 36

Body / DM Sans 16 – filter by price, beds, baths and neighborhood.

Label / DM Sans 13

Controls

Primary SecondaryQuiet link

Chip activeChip

For SaleNewComing SoonPrice Reduced

States

Empty state sample: “No homes match these filters yet.”

Error state sample: “We could not load listings just now.”

Rules in this design: status colours always carry text; links use brass-deep; the map always has a list alternative; the estimator always shows assumptions; saved homes never leave the browser.