# gojiberry.ai

Source: https://gojiberry.ai/
Captured: 2026-09-13
Tags: saas, landing, light, both, minimal, swiss, warm, confident, technical, optimistic, friendly
Colors: #fcfbfa, #f4d8ca, #fab59f, #96918f, #bab2ae, #1b1b1b, #736f6e, #504f4f
Type (h1): Fustat · 56px/56px · 400 · tracking -2.8px — "Your Al agent finds high intent leads and contacts them for you."
Type (h2): Fustat · 38px/41px · 400 · tracking -1.5px — "Finds & scores your best leads first"
Type (h3): Fustat · 24px/28px · 400 · tracking -1px — "Connect"
Type (body): Inter · 20px/26px · 400 · tracking -0.4px — "Enter your website. Gojiberry learns your business, identifies your best prospec"
Type (small): Inter · 10px/12px · 500 · tracking -0.1px — "01"
Type (button): sans-serif · 12px/normal · 400 — "Start for free Start for free"
Button (primary): "Start for freeStart for free" — fill #f5f4f3, text #0a0a0a, radius 0px, border 0px, padding 7px 24px 7px 7px, height 54px, type 12px/400
Radii: 34.4828% 32.4544% (3), 220px (3), 12px (1), 3.9604% 25.0732% (1), 15px (1)

## Images

- Hero (desktop): https://media.lvly.design/library/gojiberry-ai/hero.webp?v=0f554067
- Page crop (mid-1): https://media.lvly.design/library/gojiberry-ai/mid-1.webp?v=7545f93a
- Page crop (mid-2): https://media.lvly.design/library/gojiberry-ai/mid-2.webp?v=6ef283a1
- Hero (mobile): https://media.lvly.design/library/gojiberry-ai/mobile-hero.webp?v=f68e9cca
- Full page (desktop): https://media.lvly.design/library/gojiberry-ai/full.jpg?v=d6d9f3c9
- Full page (mobile): https://media.lvly.design/library/gojiberry-ai/mobile-full.jpg?v=8b1f7e02
- Clip preview (mp4): https://media.lvly.design/library/gojiberry-ai/video-phg3yo.preview.mp4?v=1a03ba44

A near-white Framer landing page for an AI sales agent, warmed by a soft peach-coral gradient that pools around the hero and bleeds in as blurred, glassy fan-shaped ribbons at the page edges. Fustat at 56px with -2.8px tracking gives the headline a tight, humanist geometric voice; Inter carries the body. The distinctive move is the blueprint chrome: hairline corner brackets frame the "Backed by Y Combinator" chip, the URL input, and every section heading, while nav items and process steps carry tiny superscript indices (01–04). Buttons are rectangular and unrounded — a black pill-free CTA fused to the input, and a header button whose coral arrow square sits inside its own bracketed outline. Cool grays (#96918f, #bab2ae) and an ink #1b1b1b keep the type sober against the warm wash, and step labels (Connect / Prospect / Convert) sit in ghosted gray with underlines like a tab rail waiting to be activated.

## Steal-worthy details

- Corner-bracket framing (four short L-shaped hairlines, no full border) used as the one recurring ornament — on chips, inputs, headings and cards alike.
- Superscript numbering on nav links (Features 01, Playbooks 02 …) and on process steps, in a small monospace-feeling gray.
- Input + CTA fused into a single bar: white field with a hairline border, black square-cornered button flush on the right, the whole thing sitting inside a bracket frame.
- Primary header button: pale surface (#f5f4f3), coral arrow square on the left, black label on the right, with dashed bracket marks at the corners — a button that looks like a selected layer.
- Hero background: blurred peach gradient blocks plus thin coral contour lines curving down both margins, giving depth without a drop shadow anywhere.
- Coloured word in the H2 ("3 minutes" in coral) preceded by a small pill target marker, instead of a badge or eyebrow.
- Monospace treatment for the YC badge text with the "Y" in an orange square.

## Style recipe

- Ground: #fcfbfa page with pure white surfaces; wash a soft peach gradient (#f4d8ca → #fab59f, heavily blurred) behind the hero and as vertical ribbons at the viewport edges. No drop shadows; depth comes from blur and hairlines.
- Type: geometric humanist sans (Fustat or similar) for display at 56px/56px, weight 400, tracking -2.8px (about -0.05em); Inter 20px/26px, tracking -0.4px for body; nav and captions 12–13px. Ink #1b1b1b, secondary #736f6e, tertiary #96918f, disabled/ghost #bab2ae.
- Accent: coral #fab59f for highlighted words, the arrow square and contour lines; a hotter coral-red for tiny icon squares. Never fill large areas with it.
- Frames: replace borders with corner brackets — four 8–12px L-hairlines in #bab2ae at the corners of chips, inputs, headings and cards. Dashed brackets on the primary button.
- Controls: square corners (0px radius) for buttons and inputs; 54px tall; black #1b1b1b solid CTA with white 13px label; pale #f5f4f3 secondary button with an accent icon square on the left. Fuse input and CTA into one bar.
- Indexing: attach superscript two-digit counters (01, 02 …) to nav items and step labels in 10px gray.
- Layout: centered hero with narrow measure; sections open with a left-aligned H2 inside a bracket frame; a ghosted vertical step rail (gray labels with underlines) on the left, content on the right separated by a dashed hairline.
- Motion: gentle fade/blur entrances on load; keep it quiet.
