Foundations
Public color
Warm editorial surfaces and Boise orange, expressed through semantic CSS roles.
On this page
Role and application
| Role | Use |
|---|---|
| background / paper | Page canvas and reading surfaces; preserve their subtle separation. |
| foreground / muted | Headlines and primary copy versus secondary metadata. |
| line | Rules, field borders and editorial separators. |
| accent / site-accent-light / site-accent-dark | Boise identity, links and emphasis; accent resolves to the appropriate site value. |
| success | Positive status; always accompany with explanatory text. |
| map-halo / placeholder / dialog-backdrop | Map-label legibility, missing-image surfaces and modal scrims. |
Theme relationships
The light publication uses #fbfaf7 canvas, #fffefb paper and #282523 foreground. Dark mode uses #14120f canvas, #211c17 paper and #fff8ef foreground. Boise accent is #e86f00 in light and #ff8a1f in dark. Use roles, rather than copying a light hex value into a component.
Pairing rules
- Do not assume accent text passes contrast on every surface. Validate the actual text size and role pairing.
- Keep muted copy readable; do not lower opacity on top of the muted token.
- Use foreground for primary reading text. Accent should help orientation rather than color whole paragraphs.
Source references
| File | Responsibility |
|---|---|
| app/globals.css | Audited Townwell implementation; use this file when extending this interface. |
| sites/boise/config.ts | Audited Townwell implementation; use this file when extending this interface. |
Source palette
- --background
- #fbfaf7
- --foreground
- #282523
- --paper
- #fffefb
- --muted
- #66645f
- --line
- #d9d4c9
- --site-accent-light
- #e86f00
- --site-accent-dark
- #ff8a1f
- --accent
- var(--site-accent-light)
- --success
- #16803a
- --map-halo
- #fbfaf7
- --placeholder
- #e7ded1
- --dialog-backdrop
- rgb(40 37 35 / 0.6)
Examples from the app
Actual Boise Today and Townwell UI with synthetic editorial, business, review, media metadata and analytics. Existing Boise imagery; no live data changes. Captured at 2× resolution or higher. Select an image to inspect it full size.
Related topics
Source audit: 2026-10-07 · Revision ce8bc72b96da · Documentation v0.1