Findry · product design system · October 2026

The system, rendered.

Paper, ink, and natural charcoal. The website identity carried into the product through shared tokens, compact controls, and purposeful illustrations.

The October identity / in the product

The same Findry. Ready for work.

Real shared components in both themes. Illustrative states; no workspace data.

findry

Make your next move matter.

Signals / first observation

Every good bet starts somewhere.

Capture the customer quote. Keep the source. Let the next question take shape.

findry

Make your next move matter.

Signals / first observation

Every good bet starts somewhere.

Capture the customer quote. Keep the source. Let the next question take shape.

01 · SPACE GROTESK — DISPLAY
Build product decisions that compound
H1 · 52/1.05
The Findry loop
H3 · 28/1.2
One spine. One origin.
NO SERIF · NO ITALIC · MECHANICAL SANS THROUGHOUT
02 · SPACE GROTESK — BODY + JETBRAINS MONO
Findry is where product hypotheses live, get tested, and get validated. The body voice is calm, declarative — never hyped. Never italic.
JETBRAINS MONO · META0.18–0.22em tracking
FINDRY · LOGOTYPEv2.0 · 26 OCT 2026● SIGNALS
--font-display: var(--font-space-grotesk), Space Grotesk, system-ui, sans-serif
--font-body: var(--font-space-grotesk), Space Grotesk, system-ui, sans-serif
--font-mono: var(--font-jetbrains-mono), JetBrains Mono, Fira Code, monospace

Natural charcoal + paper

Live product tokens. The same identity in dark mode.

Canvas
--night
Sidebar / inset
--night-deep
Raised surface
--night-raised
Dividers
--night-edge
Primary text
--daylight
Secondary text
--daylight-soft
Supporting text
--daylight-mute
Input border
--control-border

Paper + ink

Live product tokens. The same identity in light mode.

Canvas
--night
Sidebar / inset
--night-deep
Raised surface
--night-raised
Dividers
--night-edge
Primary text
--daylight
Secondary text
--daylight-soft
Supporting text
--daylight-mute
Input border
--control-border
Heat / a deliberate accent

Heat is precious, not decorative.

Heat marks the origin and important state. Primary actions use ink and paper. Phase colors remain product wayfinding. Body text targets a minimum 4.5:1 contrast; control boundaries target 3:1. Focus stays visible in both themes.

07 · PHASE SYSTEM — SPATIAL WAYFINDING
FOUNDRY REGISTER — 6 PHASES, 6 ACCENT HUES — TEMPERED FROM HEAT TO COOL
Signals#EA580C
Hypotheses#B45309
Tests#475569
Bets#0F766E
Outcomes#92400E
Pulse#ECEAE5
PHASEINDICATOR COMPONENT
SignalsHypothesesTestsBetsOutcomesPulse
SignalsBets
NAVIGATION RAIL PREVIEW
Signals
Hypotheses
Tests
Bets
Outcomes
Active: phase-color rule + restrained accent tint
Hover: raised surface · visible keyboard focus
Navigation: compact icon rows · no entrance animation
Rows: 40px · mobile drawer available
08 · MARK — THE TRACE
16 · min
24
32
48 · canonical
80
A · HORIZONTAL LOCKUPfindry
B · STACKED
Findry
FAVICON · APP ICON
16px
32px
64px
96px
09 · RADII
BORDER RADIUS SCALE
xs
2px
sm
4px
md
6px
lg
8px
xl
12px
2xl
16px
pill
999px
09 · SPACING — 4PX BASE GRID
SPACING SCALE
--s-1
4px
--s-2
8px
--s-3
12px
--s-4
16px
--s-5
20px
--s-6
24px
--s-7
32px
--s-8
40px
--s-9
48px
--s-10
56px
--s-11
64px
--s-12
96px
09 · ELEVATION — SHADOW SCALE
hairline
1px border only
sm
0 1px 2px / 28%
md
0 4px 12px / 36%
lg
0 12px 32px / 50%
10 · MOTION — TOKEN-DRIVEN
slide · 2.8s cubic
pulse · 2.4s ease-soft
dur-1 · 120ms · hover
dur-2 · 200ms · default
dur-3 · 320ms · layout
dur-4 · 560ms · entrance
no bounces · no springs
EASING CURVES
ease-softcubic-bezier(0.4, 0, 0.2, 1)ease-outcubic-bezier(0.22, 1, 0.36, 1)ease-incubic-bezier(0.4, 0, 1, 1)
prefers-reduced-motion: reduce → specimens go static. All motion communicates state only.
11 · BUTTONS
Primary: bg --action-bg · hover --action-hover · text --action-fg
Secondary: bg --night-raised · border --night-edge · hover --color-heat-whisper wash
Danger: bg --err-wash · border --err-line · text --err
12 · FORM CONTROLS
SWITCH · BOOLEAN TOGGLE
CHECKBOX · MULTI-SELECT
INPUT · TEXT FIELD
13 · BADGE + PILL
BADGE · SQUARE RADIUS · CATEGORY TAGS
LabelOutlineHeatWith dot
SignalsHypothesesTestsBetsOutcomesPulse
PILL · ROUND RADIUS · STATUS TAGS
openrunningpendingclosedinvalidvalid
Badge radius: --radius-xs (2px) → categorical. Pill radius: 999px → sequential status.
14 · AVATAR
SIZE SCALE
PA
xs · 20
PA
sm · 28
PA
md · 36
PA
lg · 48
ACCENT COLORS
ACBSCRDMEF
Initials from name (max 2 chars). Optional accentColor overrides border + text color.
15 · SEPARATOR
HORIZONTAL · PLAIN
HORIZONTAL · WITH LABEL
or continue with
3 signals · 1 active test
VERTICAL · IN FLEX ROW
SignalsHypothesesTests
16 · SKELETON — LOADING STATES
RECT · CARD PLACEHOLDER
TEXT LINES
CIRCLE · AVATAR PLACEHOLDER
COMPOSITE · CARD SKELETON
17 · EMPTY STATE

No signals yet

Signals are the raw observations and data points that feed your hypotheses. Add your first one to get started.

No active tests

Commit a hypothesis to a bet to start running tests.

17B · PHASE EMPTY STATES (LOOP-AWARE)
TEACHING — entry point, no upstream
SIGNALS · 0

Signals are raw observations — a user quote, a support ticket, a data point. Everything you'll eventually ship should trace back to at least one.

BLOCKED — needs upstream content first
HYPOTHESES · 0

Hypotheses are built from signals. Capture 2–3 first, then come back to articulate what they suggest.

Skip — write one anyway
READY — upstream has content, proceed
HYPOTHESES · 012 signals captured

Ready to articulate a hypothesis from what you’ve seen?

READY — with inline action rows (Bets)
BETS · 03 supported hypotheses ready to promote

Pick the strongest one and stake a sprint on it. RICE, predicted impact, owner, ship date — all in writing before code.

0.78Onboarding tooltip drives 1st-week activation
0.71Inline pricing on /vs page lifts trial signups
0.66Slack capture cuts time-to-first-signal
DIAGNOSTIC — Outcomes integration health
OUTCOMES · 0

Outcomes close the loop. The first HIT/MISS/PARTIAL lands here automatically once a tracker reports on a shipped bet.

  • 4 bets shipped
  • Tracker: PostHog connected
  • Awaiting first metric report
DIAGNOSTIC — needs tracker connection
OUTCOMES · 0

Outcomes close the loop. Connect your analytics tracker so verdicts can be detected automatically.

  • 2 bets shipped
  • Tracker: not connected
FILTERED — for any phase
SIGNALS · 0 · FILTERED

No signals match these filters. Try widening the source list or removing the date range.

Clear filters →
17C · INTEGRATION LOGOS — MONOCHROME (CURRENTCOLOR)
RESTING — daylight-soft
PostHog
Amplitude
Mixpanel
GA4
Slack
Jira
Linear
Figma
ACTIVE — daylight
PostHog
Amplitude
Mixpanel
GA4
Slack
Jira
Linear
Figma
18 · TOAST — NOTIFICATIONS
STATIC PREVIEW — LIVE SYSTEM VIA useToast() + TOASTER PROVIDER
Hypothesis H-042 updated by @paulo
Test committed — running for 5% cohort
Signal confidence below threshold (62%)
Failed to save — check connection
Provider: <Toaster /> at root layout (fixed bottom-right)
Usage: const {toast} = useToast(); toast('msg', 'success')
Stack: max 5 · auto-dismiss 4s · entrance translateY(8px) 200ms
19 · CARDS — HYPOTHESIS PATTERN
Hypothesesrunning
Digest mode drives weekly retention
PA@paulo · 3 signals
H-041closed
Onboarding compresses to 3 steps
validated · shipped 12 Apr
20 · EYEBROW — TWO MODES
A · MARKETING · SECTION LABELSpace Grotesk · 11px · 0.12em · uppercase
For product teams who build on evidenceThe state of things
B · PRODUCT META · DATA LABELSJetBrains Mono · 0.18–0.22em
H-0042 · BETS● RUNNINGv0.2.3
Marketing eyebrows: Space Grotesk 11/0.12em, uppercase, heat orange. Product meta (IDs, versions, status): Mono 0.18–0.22em — reserved for data signals.
22 · DATA-VIZ PRIMITIVES — MUX-38
VerdictPlot — predicted-vs-actual SVG instrument
predicted rangepredicted +12%−5%0%+5%+10%+15%+20%measured +9.8%
Meter — generic 0-to-max progressbar with bands
value=65 · max=100 · bands=[33, 66] · caret
Sparkline — generic SVG time-series line
Sample sparkline: 8 data points, latest 80%
StatTile — labelled numeric tile (neutral / heat / verdict)
Hypotheses24this quarter
RICE score380P0 bet
Hit rate72%last 12 months
RiceBreakdown — RICE factor rows with Meter gauges
Reach
5,000
Impact
×2
Confidence
80%
Effort
/ 4 pw
VerdictPill — mono-uppercase verdict chip
HITNEAR HITMISSINCONCLUSIVE
SignificanceBlock — plain-language + precise numbers

This bet landed just shy of its predicted target. The result is statistically significant, so it's unlikely to be down to chance.

The numbers

Effect: 9.8 (95% CI 6.2 → 13.4)

p-value: 0.031

Test: Welch's t-test

21 · ICONS — LUCIDE
SM · 12 · badges
MD · 16 · UI
LG · 18 · nav
strokeWidth=1.5 throughout
SHELL / NAV
Settings
HelpCircle
Search
Home
FEEDBACK / STATUS
Check
CheckCircle2
X
XCircle
Info
AlertTriangle
AlertCircle
DIRECTION
ArrowUp
ArrowDown
ArrowLeft
ArrowRight
ChevronUp
ChevronDown
ChevronLeft
ChevronRight
ACTIONS
Plus
Trash2
Copy
ExternalLink
Link2
Pencil
Eye
EyeOff
Lock
Unlock
STATE / UI
Loader2
RefreshCw
MoreHorizontal
Filter
Calendar
PRODUCT DOMAIN
Zap
Radio
FlaskConical
BarChart2
Megaphone
TrendingUp
TrendingDown
Import from @/components/ui/icons — never from lucide-react directly