# dub.co/partners

Source: https://dub.co/partners
Captured: 2026-09-13
Tags: saas, product, light, both, minimal, corporate-clean, trustworthy, calm, confident, technical, friendly
Colors: #fbfafd, #d6d2d3, #b8b1af, #978f8b, #747170, #594b44, #070707, #2c2727
Type (h1): satoshi · 48px/55.2px · 500 — "Grow your revenue with partnerships"
Type (h2): satoshi · 48px/48px · 500 — "Revenue on autopilot"
Type (h3): Inter · 16px/24px · 600 — "Flexible reward structure"
Type (body): Inter · 20px/28px · 400 — "Dub is the modern affiliate marketing platform for partnering with affiliates, i"
Type (small): Inter · 12px/16px · 500 — "Revenue"
Type (button): Inter · 14px/20px · 400 — "Sign up"
Button (primary): "Sign up" — fill #000000, text #ffffff, radius 8px, border 1px, padding 0px 16px, height 32px, type 14px/400
Button (secondary): "Product" — text #404040, radius 8px, border 0px, padding 0px 12px, height 32px, type 14px/500
Radii: 9999px (88), 8px (39), 10px (13), 6px (7), 12px (4)

## Images

- Hero (desktop): https://media.lvly.design/library/dub-co-partners/hero.webp?v=7414339f
- Page crop (mid-1): https://media.lvly.design/library/dub-co-partners/mid-1.webp?v=c62eabe3
- Page crop (mid-2): https://media.lvly.design/library/dub-co-partners/mid-2.webp?v=bf22f897
- Hero (mobile): https://media.lvly.design/library/dub-co-partners/mobile-hero.webp?v=f4b74b1f
- Full page (desktop): https://media.lvly.design/library/dub-co-partners/full.jpg?v=f1285e33
- Full page (mobile): https://media.lvly.design/library/dub-co-partners/mobile-full.jpg?v=5b4c34b5
- Clip preview (mp4): https://media.lvly.design/library/dub-co-partners/video-0ilgiz.preview.mp4?v=b8582946

Dub's Partners page is the near-white SaaS product page done with unusual discipline: a `#fafafa` ground, a 1px hairline frame running the full height of the content column so every section reads as a panel on a drafting sheet, and a black/white/gray palette in which the only chroma is a faint violet — a tiny pill icon in the hero badge, the dots on a stippled globe, the big tabular stat numerals — so the brand color registers as a rumour rather than a shout. Satoshi at 48px/500 for headlines against Inter body at 20px keeps the type quiet and geometric; the black Sign up and Get started buttons carry a modest 8px radius while everything else — the badge, the nav pills, the avatars' corners — leans rounder. The hero's proof is a fading grid of partner cards (portrait, flag, Revenue/Payouts figures) that dissolves into the background at the edges, and further down a dot-matrix hemisphere with live "New referral sale" toasts stacked to its right; the density is real but the temperature stays cool and gray, which is what makes a money product feel like infrastructure rather than a pitch.

## Steal-worthy details

- The full-height hairline column: two vertical 1px lines bound the content width and horizontal rules cross them at every section break, so the page reads as one continuous ruled sheet rather than stacked blocks.
- A three-tier button system with real hierarchy in one hero — solid black primary, white bordered secondary with a leading play glyph, and a soft gray pill for the active nav item — all on the same 32px control height.
- The "proof grid" hero visual: a 4×3 mosaic of partner cards where the outer columns and bottom row fade to transparent via mask, so the data feels endless without any scrolling or carousel chrome.
- Accent color as a whisper: violet appears only in the badge icon, three dots on the globe, and the headline stats — never on a button — so a single hue reads as premium instead of loud.
- Feature columns separated by hairlines only (no card backgrounds), each closing on a small white bordered "Learn more" button aligned to the same baseline across all three.
- The stippled hemisphere: a globe rendered as dot density that fades to nothing at the horizon, with notification toasts (flag · label · two-column figures) laid over it as a staggered vertical stack.
- Country flags as tiny circular emoji-style glyphs prefixed to every name and every toast — a cheap, legible way to say "global" without copy.
- Headline em-dash line with an italic close ("– *every single month*.") — one typographic flourish in an otherwise deadpan body voice.

## Style recipe

Build on a near-white ground (`#fafafa`) with pure white (`#ffffff`) for cards and controls, ink `#070707`, body gray `#747170`, and hairlines around `#e5e5e5`/`#d6d2d3`. Frame the content column with two full-height 1px vertical rules and cross them with horizontal rules at every section boundary; let backgrounds stay flat and put all structure in those lines. Set display type in Satoshi (or a geometric grotesk) at 48px / weight 500 / 1.15 line-height, body in Inter 400 at 18–20px / 1.4, and secondary labels at 12–13px in the body gray; use tabular figures for any number. Reserve one accent — a soft violet in the `#7c3aed`–`#6d28d9` range — for icons, dot ornaments and big stat numerals only; buttons are black-on-white (`#000000` fill, `#ffffff` text, 8px radius, 32px height, 14px/400 label) or white with a 1px border. Use 9999px radius on pills, badges and avatars; 8–10px on buttons and cards; never larger than 12px. Show proof as dense, repeating card mosaics or stacked toasts (flag glyph · name · two-column metric pairs) and fade the edges of any dense mosaic with a linear mask rather than cropping it. Illustrations are monochrome dot-matrix or line work with the accent used on three or four dots at most. Keep copy short and declarative, prefix people and events with small circular flag glyphs, and let whitespace and hairlines, not color, carry the hierarchy.
