A warm, near-monochrome workspace aesthetic — paper-white surfaces over a soft oatmeal canvas, near-black warm ink, and a single confident blue carrying every CTA and link, with a playful saturated accent set kept strictly inside the product illustrations.
A warm greyscale doing nearly all the work, spiked by one decisive action blue. The saturated accents below are an illustration palette — they never appear as interface chrome.
NotionInter — a custom cut of Inter — shown here via Google Fonts Inter, the nearest faithful substitute. Hierarchy is built through size and tight negative tracking; weight stays within 400 / 500 / 700.
Cards rest flat on a hairline border and lift with a soft, multi-layer shadow on hover. Radius is 12px, with a media tile filling the top.
A 4px base unit expands through a 4 · 8 · 12 · 16 · 24 · 32 · 48 scale that maps cleanly onto the type rhythm.
8px is the default for buttons and inputs. The system tops out at 16px plus true pills — nothing bubbly.
| Name | Width | Key changes |
|---|---|---|
| Mobile | < 768px | Single column; hero display drops to ~48px; nav collapses to a menu. |
| Tablet | 768–1023px | Four-column card rows fold to two; gutters tighten. |
| Laptop | 1024–1279px | Full multi-column grid returns within the ~1200px column. |
| Desktop | ≥ 1280px | Centred column with wide outer margins; display type at full scale. |
The layout trusts whitespace and faint top-rules — not heavy bands — to separate sections, keeping the premium, document-first feel at every width.
Pattern demonstration with representative Notion-style tiers — the featured plan inverts to the pure-black surface.
A Notion-database-style view — status carried by full-radius pills tinted from the palette rather than loud colour.
| ID | Task | Owner | Status | When |
|---|---|---|---|---|
| NOT-418 | Draft Q3 launch brief | A. Rivera | Done | 2h ago |
| NOT-417 | Refresh template gallery | M. Chen | In progress | 5h ago |
| NOT-415 | Wiki information architecture | S. Patel | Done | Yesterday |
| NOT-412 | AI agent onboarding flow | J. Wells | In progress | 2d ago |
| NOT-409 | Pricing page copy review | L. Osei | In review | 3d ago |
Quiet, centred cards with a single blue primary action and an SSO fallback below a hairline divider.