Premium fintech infrastructure with relationship counterculture. Cool surfaces prove the product; warm surfaces prove the people. Never mix. This is the executable spec — every color has a hex, every spacing has a px, every component has explicit states.
Four-color brand palette plus tint/shade scales 50–900, semantic colors, the rationed cyan→blue gradient, and dark-first surface tokens.
Tailwind-aligned 50–900 stops. Note: cyan is anchored at 400, not 500 — engineers will re-anchor by default; do not.
Tailwind-aligned. Each has fg / bg / strong variants — see the contrast table below for AA pairings.
Hard rule: ONE marquee gradient per page. Reserved for the single highest-priority CTA. Never on H1 fills, dividers, card backgrounds, or hover states.
Computed contrast ratios for canonical hex pairings on canonical surfaces. AA = 4.5:1 body / 3:1 large text.
| Foreground | Surface | Ratio | Verdict |
|---|---|---|---|
| chisel-blue-500 | surface-page (#0A0E1A) | 4.39:1 | ⚠ Large text only |
| chisel-blue-300 | surface-page (#0A0E1A) | 7.62:1 | ✓ AA / AAA |
| chisel-cyan-400 | surface-page (#0A0E1A) | 11.43:1 | ✓ AAA |
| chisel-cyan-400 | #FFFFFF | 1.42:1 | ✗ Decoration only |
| white | surface-page (#0A0E1A) | 18.79:1 | ✓ AAA |
| chisel-charcoal-800 | #FFFFFF | 11.64:1 | ✓ AAA |
| chisel-charcoal-800 | surface-page (#0A0E1A) | 1.13:1 | ✗ Never use |
Three families: Montserrat (display), Open Sans (body), JetBrains Mono (code/numerics). Avenir Next Arabic dropped per Tension 2 resolution.
// payments-flow.ts
const tx = await chisel.processor.charge({
amount: 6_000_000_00, // $6M+ processed
uptime: '99.99%', // SLA
sponsor_bank: 'direct', // not middleware
});
if (tx.status !== 'settled') throw new Error('escalate to Matt');
Same paragraph, three line-heights. Default (1.6) is canonical for body.
tabular-nums ON for tables, KPIs, charts. Compare alignment of the two columns below.
| METRIC | PROPORTIONAL | TABULAR ★ |
| Processed | $6,123,456 | $6,123,456 |
| Uptime | 99.9912% | 99.9912% |
| Integrations | 102 | 102 |
| Automation | 90.3% | 90.3% |
Lucide as the foundation library; 10 custom marquee glyphs for doctrine-load-bearing concepts. Container is the Chisel signature at icon scale.
Filled Chisel-Blue rounded-square. Three sizes: 24 / 40 / 64 px. Glyph fill always white.
Custom marquee SVGs are not yet authored. v1.1 deliverable per §6.5 production pipeline. Fallback: closest Lucide outline rendered in the marquee container — never a missing-icon placeholder.
Lucide outline · 1.5px stroke · currentColor. No container. Used in body copy, button prefixes, list bullets, breadcrumbs.
Hybrid: 3D for marquee anchors, flat geometric for inline. Pipeline owned by chisel-mkt + AI tools (Midjourney / DALL-E / SD). Zero external agency cost.
Three canonical objects shipping on production: Chisel Laptop / Box / Cloud. Lit Chisel Blue with cyan rim light, soft shadows, dark-surface-friendly. References at gochisel.com.
"Modernize" — homepage product tile
"Manage" — homepage product tile
"Limit" — homepage product tile
Bank CTOs detect in <2s. Credibility cost > production cost. Absolute ban.
One per illustration. No flat shapes nested in 3D scenes.
Floating brain, neural mesh, glow-orb. Off-brand and unserious.
Storyset / unDraw / Blush — banned. Reads like 2019 SaaS.
Real humans, named, professional B&W treatment for warm trust surfaces. AI-generated portraits absolutely banned.
Already shipping at gochisel.com/about/team as of 2026-05-08. Five professional B&W portraits. Treatment: head-and-shoulders, soft-blur background, business-casual wardrobe.
Ranked acceptability for trust-bearing photography. AI-generated humans are an absolute, no-exception ban.
| Rank | Source | Verdict |
|---|---|---|
| 1 | Real Chisel humans (commissioned) | Phase 1 done |
| 2 | Real customer humans (LinkedIn-grade w/ permission) | Allowed |
| 3 | Unsplash texture / environment B-roll | Allowed |
| 4 | Pexels texture / environment B-roll | Allowed |
| 5 | Canva stock — texture only, never people | Texture only |
| 6 | Stock-photo people (Shutterstock / Getty / iStock) | Banned |
| 7 | AI-generated humans / portraits / faces | Absolute ban |
| 8 | Scraped customer photos without permission | Banned |
Six primitives + table system + the trust-signal dashboard widget — the single highest-leverage marquee visual in the entire system.
4 KPI tiles + named accountability strip. Cool form, warm content. The fusion artifact.
Cost stack comparison: Old (BaaS middleware) vs Chisel (direct).
Integration health snapshot — 4-column grid.
No striping. Hairline dividers. Tabular-nums on numeric columns. Eyebrow header.
| PARTNER | TYPE | FEE % | VOLUME / MO | STATUS |
|---|---|---|---|---|
| Discover | Network | 0.42% | $1,240,500 | Active |
| WebBank | Sponsor bank | 0.18% | $2,890,100 | Active |
| Lithic | Issuer-processor | 0.55% | $ 980,300 | Active |
| Tabapay | ACH / RTP | 0.28% | $ 615,720 | Degraded |
| Pathward | Sponsor bank | 0.21% | $1,544,000 | Active |
9 components, dark-first, all states (default · hover · active · disabled · focus). Universal 2px cyan focus ring.
Hover the buttons above to see :hover + :active states. Tab through them to see the universal 2px cyan focus ring.
Marquee card variant — soft Chisel-Blue radial glow, radius-lg, elev-glow box-shadow. Reserved for 3 product anchors per page max.
Default content-dense card — surface-elevated, 1px border-default, radius-md, space-5/6/7 padding. The everyday card.
Learn more →Click into the inputs to see the cyan focus ring. Voice register: §12.2 contact / forms — direct, no fluff.
Centered card · surface-overlay · radius-lg · elev-4 box-shadow. Reduced-motion respected.
T1–T6, composed from §7 components and §6 viz primitives. Hero rows are cyan-bordered; CTA blocks are blue-bordered; data blocks are green-bordered.
Homepage, /solutions, /products. Codifies what already works.
/for-fintechs · /for-banks · /for-platforms.
Upgrade of the current 4-stat oversized-text strip on homepage.
/about/team — already shipping. /about/team/[name] is new.
Rollcard #1 · WebBank #2 · LobbiCard #3 per MEMORY.md.
/blog/[slug] · ADR-001 approved by Matt.
Economics-driven · accessible but credible · no schadenfreude · named accountability · Software as a Relationship.
Things v1 catches at the PR-review visual gate. Each is enforced by the corresponding spec section.
Generic flat illustration of "API + bank + fintech = magic." Stack diagrams as marketing collateral. Chisel's positioning is against this category.
Bright gradient + abstract circuits + "infrastructure" copy with no humans visible. This is what the failed BaaS providers looked like.
Six photos of generic-happy-people-with-laptops. Reads inauthentic. Dilutes the relationship thesis. Hard ban per §8.3.
Floating brain · glowing chip · neural-network mesh · robot finger touching human finger. Off-brand and unserious for a bank-CTO audience.
Bank CTOs detect in <2s. Credibility cost > production-cost saving. Absolute ban.
Dark + neon + glow + abstract token imagery. Wrong neighborhood — bank CTOs read crypto-aesthetic as risk.
Every CTA, every H1, every divider with cyan→blue gradient. Dilutes the marquee signature. Hard rule: ONE per page.
Spreadsheet-style alternating row backgrounds. Reads as Excel, not product. §9.5 hard rule: clean rows only.
Buttons at 6px, cards at 7px, modals at 9px. Looks unfinished. §4.6 token-only enforcement.
4px-base spacing scale, radius scale, elevation tiers, motion durations. Hard rule: every component picks one token from each scale and sticks.
Sparing on dark surfaces — too much shadow reads as muddy. The marquee elev-glow does most of the visual lift.
Hover the cards to see the timing tokens in action. Reduced-motion respected globally.
Every marketing PR runs the visual gate (chisel-mkt + Todd) before engineering review (Matt). Quarterly audit. ADR cadence.
Two-gate review:
Checklist runs through tokens · gradient rationing · 3D pipeline · photography sourcing · anti-patterns · voice register · WCAG AA.
| Tier | Trigger | Approval |
|---|---|---|
PATCH | Typo / value correction | Author edit |
MINOR | New tokens / components | ADR + Matt review |
MAJOR | Breaking change | ADR + Darin sign-off |