# visitors.now

Source: https://visitors.now/
Captured: 2026-09-13
Tags: saas, landing, light, both, minimal, corporate-clean, bento, friendly, calm, confident, optimistic, trustworthy
Colors: #fefefe, #c4a1e9, #9786ee, #d1d0d9, #8c8c92, #aeaeb1, #e9d9f2, #696971
Type (h1): OpenRunde · 60px/68px · 600 · tracking -3px — "Revenue-first web analytics"
Type (h2): OpenRunde · 36px/44px · 500 · tracking -1.8px — "Everything you need to understand your visitors"
Type (h3): OpenRunde · 18px/24px · 500 · tracking -0.32px — "Lightweight script. Under 1KB. Won't hurt your page speed or Core Web Vitals."
Type (body): OpenRunde · 18px/24px · 500 · tracking -0.32px — "See every visitor in realtime and witness the moment they become a customer."
Type (small): OpenRunde · 12px/16px · 500 · tracking -0.32px — "NEW"
Type (button): OpenRunde · 16px/24px · 500 · tracking -0.32px — "Start 14 day free trial"
Button (primary): "Start 14 day free trial" — fill #918df6, text #ffffff, radius 9999px, border 0px, padding 0px 20px, height 44px, type 16px/500
Button (secondary): "Features" — text #bbbcc3, radius 0px, border 0px, padding 4px 8px, height 28px, type 14px/500
Radii: 9999px (29), 8px (11), 16px (9), 24px (1)

## Images

- Hero (desktop): https://media.lvly.design/library/visitors-now/hero.webp?v=d056ab36
- Page crop (mid-1): https://media.lvly.design/library/visitors-now/mid-1.webp?v=551e90ef
- Page crop (mid-2): https://media.lvly.design/library/visitors-now/mid-2.webp?v=e03ba267
- Hero (mobile): https://media.lvly.design/library/visitors-now/mobile-hero.webp?v=91541ca0
- Full page (desktop): https://media.lvly.design/library/visitors-now/full.jpg?v=0b755c67
- Full page (mobile): https://media.lvly.design/library/visitors-now/mobile-full.jpg?v=a6ed2576
- Clip preview (mp4): https://media.lvly.design/library/visitors-now/video-v0h1pe.preview.mp4?v=d9e1fa11

Visitors is a privacy-friendly analytics landing built on a bright white ground and one soft periwinkle accent (#918df6), with a floating black pill nav as the only dark object on the page. The hero is pure type — a 60px/600 Open Runde headline tracked to -3px, sitting on a rounded geometric sans that makes even "Revenue-first web analytics" read as approachable — with a pill CTA pair and a grayscale logo strip underneath. Then the page opens into a soft lavender-and-violet aurora backdrop on which the real product dashboard floats as a white card; below, a two-column bento of white feature cards pairs a coloured section label (pink, amber, green per feature) with a live-looking data fragment (a visitor list with flag avatars, a world map with coloured dots, a big green 100 "Perfect" score ring). Everything is pill-shaped — 9999px is the dominant radius — so the whole site feels like a friendly, well-organized dashboard rather than a pitch.

## Steal-worthy details

- Floating dark pill nav (black, ~9999px radius) that stays the only dark element on a white page, with the accent-filled Register button nested inside it as a pill-within-a-pill.
- Hero headline set in Open Runde at 60px/600 with -3px tracking: the rounded terminals keep a tight, heavy headline from feeling cold.
- Announcement pill above the H1: a small solid "NEW" badge inside a tinted outer pill ("We hit $1K MRR ›") — two nested radii, one tint family.
- Section transition that swaps a white hero for a soft violet aurora gradient, with a segmented tab bar (Dashboard · Profiles · Funnels · Performance · Realtime) floating on the seam and the product screenshot rising out of it.
- Feature cards each open with a small circular icon chip, a coloured eyebrow title (pink / amber / green — one hue per feature), a black two-line subtitle and a three-item checklist with icons in the same hue, then a ghost pill "Learn more ›" — a consistent recipe repeated across a bento grid.
- Data used as decoration: the visitor table with flag-overlaid avatars and verified ticks, referrer pills (Google, Twitter, GitHub, Hacker News) with favicons, and the large green score ring with a "0-49 / 50-89 / 90+" legend.
- Metric strip in the dashboard mock: small gray label, bold value, red/green delta chip in tabular figures.

## Style recipe

- Ground: pure white (#ffffff) page, white cards, hairline borders in ~#e5e5ea; no drop shadows heavier than a faint blur.
- Accent: one soft periwinkle, #918df6, for the primary CTA, the nav button and active states; optional lilac tints (#c4a1e9, #e9d9f2) as a large soft aurora gradient behind a product showcase.
- Secondary hues only as data/eyebrow color: pink, amber, green — each feature or metric owns one hue, applied to its eyebrow title, icon chip and checklist icons.
- Type: Open Runde (fallback Inter) throughout. Display 60px / 600 / -3px tracking / 68px line height; body 18px / 500 / -0.3px tracking; gray (#696971 – #8c8c92) for supporting copy.
- Shape: pill radius (9999px) for every button, badge, tab and nav; 16px for cards, 8px for inner chips. Primary button 44px tall, solid accent, white 16px/500 text; secondary is a light gray pill.
- Navigation: a floating, centered black pill bar with white links, the accent pill button at its right end; keep it the only dark object on the page.
- Layout: centered hero of type only, then a logo strip in grayscale, then a two-column bento of equal white cards with generous 40px internal padding; each card = icon chip, coloured eyebrow, black subtitle, checklist, ghost link, then a live data fragment.
- Motion/feel: calm and friendly; let real-looking UI (tables, maps, score rings) carry the visual weight instead of illustration.