# bydefault.so

Source: https://www.bydefault.so/
Captured: 2026-09-13
Tags: saas, landing, light, both, minimal, corporate-clean, confident, energetic, technical, trustworthy, friendly
Colors: #f9f9f9, #d8d2cf, #8f8d8c, #b3b1b0, #f0550a, #736f6f, #ecb59d, #f37b3f
Type (h1): GeistSans · 56px/61.6px · 500 · tracking -1.12px — "Become the product ChatGPT and Claude recommend by default."
Type (h2): GeistSans · 44px/47.52px · 500 · tracking -0.88px — "200 million people use AI daily. Let's make your business discoverable."
Type (h3): GeistSans · 16px/24px · 500 — "Find out where you stand"
Type (body): GeistSans · 18px/30.6px · 400 — "Track and improve your visibility in AI search results. See where you stand toda"
Type (small): GeistSans · 12px/20px · 400 — "upstash.com"
Type (button): GeistSans · 16px/24px · 400 — "See what AI says about you →"
Button (primary): "See what AI says about you →" — fill #f15a0f, text #ffffff, radius 6px, border 0px, padding 0px 24px, height 40px, type 16px/400
Button (secondary): "How it works" — text #57534e, radius 6px, border 0px, padding 6px 10px, height 32px, type 14px/400
Radii: 8px (17), 6px (13), 20px (6), 9999px (5), 12px (5)

## Images

- Hero (desktop): https://media.lvly.design/library/bydefault-so/hero.webp?v=ac68718c
- Page crop (mid-1): https://media.lvly.design/library/bydefault-so/mid-1.webp?v=8e01192b
- Page crop (mid-2): https://media.lvly.design/library/bydefault-so/mid-2.webp?v=9bce2f55
- Hero (mobile): https://media.lvly.design/library/bydefault-so/mobile-hero.webp?v=1150cd10
- Full page (desktop): https://media.lvly.design/library/bydefault-so/full.jpg?v=600982b0
- Full page (mobile): https://media.lvly.design/library/bydefault-so/mobile-full.jpg?v=84005811
- Clip preview (mp4): https://media.lvly.design/library/bydefault-so/video-xt4bvo.preview.mp4?v=6afcdede

ByDefault is a near-white Geist landing page with one loud idea: a single saturated orange. The hero is a centered 56px medium-weight headline in warm near-black, tracked tight, with the words "ChatGPT" and "Claude" lifted into hairline pill chips carrying each model's mark — the value proposition is literally set in the typography. Everything else stays quiet: an 18px gray body, a 6px-radius orange CTA under a globe-prefixed URL input, a hairline logo strip with a bold "1,000,000+" figure, and a page ground of #f9f9f9 framed by diagonal-hatched gutters that read like a blueprint margin. Below, a hand-lettered annotation with a curved arrow points at a browser-framed product demo, and then the palette flips: a full-bleed orange band on a faint dot grid holds three white cards, each numbered, captioned, and finished with a dashboard screenshot behind a big dark play button. Two-tone (paper + orange), Vercel-adjacent restraint, sales-page conviction.

## Steal-worthy details

- Inline "chip" nouns in the headline: `ChatGPT` and `Claude` set in white rounded rectangles with a 1px border and the vendor glyph, at full display size — the key nouns become UI objects, and Claude's chip is tinted terracotta to break the monochrome.
- Diagonal-hatched page gutters on either side of the 1190px content column: a thin repeating 45° line pattern in the same warm gray, turning empty margins into a drafting-sheet frame.
- Stacked hero form: a full-width input with an icon prefix cell (globe, separated by a hairline), then a same-width solid orange button directly beneath it — no side-by-side, no competing widths.
- Social proof as a sentence: "Analyzing **1,000,000+** AI crawler requests daily for" followed by three small logo+name lockups, all in one 14px line inside a hairline-bounded band.
- Hand-lettered callout ("Automated tracking for Upstash, a database company") with a curly pencil arrow pointing into the demo — a single moment of human texture on an otherwise systematic page.
- Full-bleed orange section with a barely-visible dot grid, a translucent pill eyebrow ("The Loop"), and three white 12px-radius cards that split into a text head and a full-bleed screenshot foot with an oversized dark circular play button.
- Numbered step cards use a tiny gray ordinal (`01`, `02`, `03`) above the title rather than a badge or icon.

## Style recipe

Set the page ground to #f9f9f9 (not pure white) and reserve #ffffff for cards, inputs and inset bands so surfaces read as raised by a shade. Frame the content column (max ~1190px) with hatched side gutters: `repeating-linear-gradient(45deg, transparent 0 6px, rgba(0,0,0,0.05) 6px 7px)` bounded by 1px #e5e5e5 vertical hairlines. Type is Geist Sans throughout: display at 56px / 1.1 / weight 500 / letter-spacing -0.02em in a warm near-black (#1a1918); body at 18px / 1.7 / weight 400 in a mid gray (#736f6f); UI labels at 14px / 500. Use exactly one accent, #f15a0f, and use it fully saturated — solid fills, never tints — on primary buttons (height 40px, radius 6px, 0–24px horizontal padding, white 14px/500 label with a trailing → arrow) and on one full-bleed section per page; secondary accents are limited to a terracotta text tint (#c2410c-ish) for emphasised words. Radii: 6px for controls, 8px for inputs and chips, 12px for cards, 9999px for pills and avatars. Borders are 1px hairlines in #e5e5e5 on light, and cards get a soft 0 1px 2px shadow only. Inputs carry a leading icon cell separated by a hairline, and stack the CTA beneath at the same width. Put key nouns in the headline inside white bordered chips with the relevant glyph, sized to the display type. Allow one hand-drawn element (a script annotation with a curved arrow) per page, in gray, as the only informal mark. Inverted sections use the accent as background with a 3% white dot grid, white 40px/500 display type, a translucent white pill eyebrow (`bg-white/15`, `border-white/25`), and white cards whose lower half is a screenshot with a centered dark circular play control.
