# boardy.ai

Source: https://www.boardy.ai/
Captured: 2026-09-13
Tags: saas, landing, light, both, minimal, retro-warm, friendly, warm, confident, human, trustworthy
Colors: #f3f1ea, #d1cfc9, #72706c, #989691, #b2b5ad, #52504d, #32302d, #1f8a40
Type (h1): Plus Jakarta Sans Variable · 70.4px/71.808px · 700 · tracking -2.816px — "I can introduce you to anyone, try me"
Type (h2): Plus Jakarta Sans Variable · 57.6px/60.48px · 700 · tracking -2.304px — "A useful introduction starts with context."
Type (h3): Plus Jakarta Sans Variable · 29.6px/33.152px · 700 · tracking -0.888px — "Tell me the outcome you need."
Type (body): Bricolage Grotesque Variable · 16.8px/26.04px · 400 — "210,160+ introductions made to investors, customers, talent, founders, creators,"
Type (small): -apple-system · 12px/18px · 600 — "Today 1:18 PM"
Type (button): Bricolage Grotesque Variable · 14px/21px · 580 · tracking -0.14px — "Message Me"
Button (primary): "Message Me" — fill #1a1715, text #f5f2eb, radius 12px, border 1px, padding 0px 18px, height 48px, type 14px/580
Radii: 12px (7), 50% (4), 999px (4), 3px (2), 16px (1)

## Images

- Hero (desktop): https://media.lvly.design/library/boardy-ai/hero.webp?v=bede0470
- Page crop (mid-1): https://media.lvly.design/library/boardy-ai/mid-1.webp?v=8e401c31
- Page crop (mid-2): https://media.lvly.design/library/boardy-ai/mid-2.webp?v=6a1781b6
- Hero (mobile): https://media.lvly.design/library/boardy-ai/mobile-hero.webp?v=ad4ed18a
- Full page (desktop): https://media.lvly.design/library/boardy-ai/full.jpg?v=295dd35d
- Full page (mobile): https://media.lvly.design/library/boardy-ai/mobile-full.jpg?v=e803af68
- Clip preview (mp4): https://media.lvly.design/library/boardy-ai/video-odhw0a.preview.mp4?v=a350a84c

Boardy's landing page is written in the first person by an AI that makes introductions, and the design is built to make that voice feel like a person texting you. The whole page sits on warm parchment (`#f5f2eb`, ~90% of the canvas) with a soft cream vignette behind the hero; the headline is Plus Jakarta Sans at 86px, weight 650, tracked to −3.9px so "I can introduce you to anyone, try me" reads as one tight, confident block, while body copy switches to Bricolage Grotesque for a slightly quirkier, more human counterweight. A floating pill-shaped nav (12px radius, hairline border, near-black `#1a1715` CTA) hangs over the hero; the single accent is iMessage green (`#1f8a40`), used for the "Message Me" button, the sent bubbles inside an iPhone mockup showing a real-feeling conversation, and the green stat numeral. Deeper down, a single near-black-green card with a radial glow carries the proof — "204,958+ introductions made" in cream, three stats separated by hairlines — and a row of tilted, spring-scattered channel icons (WhatsApp, iMessage, LinkedIn, X, Gmail, Meet) orbits Boardy's pixel-art avatar. Restraint everywhere, one color, one voice.

## Steal-worthy details

- **Paper ground + one green**: `#f5f2eb` page, `#1a1715` ink, and a single green `#1f8a40` for every interactive or "message" moment — the palette is three values and never wavers.
- **Type pairing that carries the personality**: Plus Jakarta Sans 650 at −4.5% tracking for display, Bricolage Grotesque 400 at 16.8/26 for body — geometric confidence up top, a warmer, slightly eccentric grotesque underneath.
- **Floating nav pill**: white card, 12px radius, 1px hairline, soft shadow, detached from the page edge; the nav CTA is a solid near-black 48px button with a `→` while the hero CTA is green — two buttons, two weights of urgency.
- **iPhone mockup as the product demo**: real iMessage chrome (status bar, avatar header, gray/green bubbles) makes the "AI" tangible as a text thread; lowercase, casual copy in the bubbles does more selling than the headline.
- **Scattered app-icon row**: rounded-square channel icons rotated ±10° with staggered vertical offsets and soft shadows, the brand avatar centered in a cream circle — a "we live in your apps" statement with no copy.
- **Proof card in inverted scheme**: one dark green-black card (radius ~24px, radial glow top-right) holds the big number (green) and headline (cream) at the same 86px scale as the hero, with three stats under a hairline rule — the only dark surface on the page, so it lands.
- **Live counter as headline**: the same "204,958+" appears in the hero subline (bold) and again as the stat headline; repetition of one moving number reads as momentum.

## Style recipe

Set the page on warm paper `#f5f2eb` (surfaces `#f3f1ea`, hairlines `#d1cfc9`, secondary text `#72706c`, ink `#1a1715`). Use exactly one accent, a saturated iMessage-style green `#1f8a40`, for primary CTAs, "sent" states, and highlighted numerals; never introduce a second hue. Headlines in Plus Jakarta Sans (or a geometric humanist sans) at weight 650, 80–90px, line-height 0.98, letter-spacing −4.5%, centered, two lines max, written in first-person conversational copy. Body and UI in Bricolage Grotesque at 400, 16–17px, line-height 1.55; keep captions at 12–13px muted. Buttons are 48px tall, 12px radius, 0 18px padding, weight 580 at 14px, solid fill (near-black for secondary, green for primary), with a trailing arrow icon; pills use 999px. Cards use 12–16px radii with a 1px hairline and a barely-there shadow; float the nav as a detached white pill 20px from the top. Add one inverted "proof" section: a near-black green card (`#1a2a20` → `#0f1a14` radial glow) with cream headline text and green key numbers, stats separated by hairline dividers. Show the product as a device mockup with real OS chat chrome rather than illustrated UI. Motion: soft fade-and-rise on load, icons scattered with ±10° rotation and slight parallax; nothing bouncy. Overall feeling: calm, human, confident — the interface of a friend who texts you back.