Refto
Browse all Markers

Marker

Nav Website Inspiration

Browse 16 curated Nav marker examples captured from real site versions to review the exact moments, sections, and UI details worth referencing.

16 curated examples24 per page

Why Marker Pages Matter

Marker collections surface specific captured moments for Nav, so you can inspect the exact UI reference without scrubbing an entire recording.

What To Compare

Pay attention to the captured timestamp, surrounding context, and how that Nav moment fits into the full page narrative and conversion flow.

Design Analysis

What stands out in Nav websites

Soft Commerce Bloom is a commerce-marketing language built from restraint: a light editorial serif voice, a barely-there warm wash, and proof delivered through warm video and customer imagery. The page should feel commer... Build the first fold as a clean conv...

Recurring Signals

  • Primary ( 000000): Main type and dark supporting CTA.
  • Secondary ( FAF8EF): Atmospheric bloom and grouped surface tone.
  • Tertiary ( A3FDA7): High-intent signal pill and primary CTA fill.
  • Use the low-weight serif for conceptual headlines and section openers.
  • Keep all interface copy in a plain, contemporary sans.
  • Avoid heavy bolding; let scale and whitespace create luxury.

Related Keywords

OverviewImage DirectionColorsTypographyUse oatmeal and black as the structural baseKeep the whole experience optimistic and low-noiseKeep the shell nearly whiteLet monochrome pills keep the interaction posture groundedKeep proof tidy and clearly categorizedUse white and dark graphite as the baseUse black pills as the clearest action voiceKeep the palette almost monochrome and warm

Swap Commerce

Home

2026-02-03

Soft Commerce Bloom is a commerce-marketing language built from restraint: a light editorial serif voice, a barely-there warm wash, and proof delivered through warm video and customer imagery. The page should feel commer...

  • Primary ( 000000): Main type and dark supporting CTA.
  • Secondary ( FAF8EF): Atmospheric bloom and grouped surface tone.
Open example

Amplemarket

Home

2026-01-20

Build the first fold as a clean conversion stage, then let the aura and illustration introduce energy below it. Keep the tone sales-forward and legible rather than dreamy. Use the line illustration to avoid a generic das...

  • Build the first fold as a clean conversion stage, then let the aura and illustration introduce energy below it.
  • Keep the tone sales-forward and legible rather than dreamy.
Open example

Lens

Home

2026-01-14

Build the page as an airy white ecosystem space with only one strong fill color: mint. Let faint background linework and soft cards provide just enough personality without compromising clarity. Keep the whole experience...

  • Build the page as an airy white ecosystem space with only one strong fill color: mint.
  • Let faint background linework and soft cards provide just enough personality without compromising clarity.
Open example
Home
Play
Play - Home
Home
Swap Commerce
Swap Commerce - Home
Duo
Amplemarket
Amplemarket - Duo
Home
Amplemarket
Amplemarket - Home
Home
Lens
Lens - Home
Home
Mixpanel
Mixpanel - Home
Home
Giga
Giga - Home
Home
Cursor
Cursor - Home
Home
Trawelt
Trawelt - Home
Home
Vercel
Vercel - Home
Winter '26
Shopify Editions
Shopify Editions - Winter '26
Home
Epic Games Store
Epic Games Store - Home
Home
Attio
Attio - Home
Home
Visitors
Visitors - Home
Home
COLLINS
COLLINS - Home
Home
Jackie Zhang
Jackie Zhang - Home

Continue Exploring

Use these internal hubs to keep branching from Nav into broader design research, structured design analysis, or adjacent website inspiration taxonomies.

Hub

More Markers

Return to the broader markers hub if you want to branch into adjacent topics beyond Nav.

Related Hub

Design Topics

Browse pages grouped by repeated design signals when you want inspiration organized by visual patterns instead of taxonomy alone.

Related Hub

DESIGN.md Examples

Study structured design analysis, reusable tokens, and AI-readable system guidance tied back to real production websites.

Workflow Collection

Developer Tools UI References

References and tools for docs-heavy products, developer tooling, terminals, dashboards, SDK workflows, and technical product surfaces.

Workflow Collection

Figma AI References

References for Figma AI, Figma Make, MCP-assisted design workflows, and editable UI generation.

Workflow Collection

AI Design System Examples

DESIGN.md-style references, token-driven systems, and tools for AI-readable design workflows.

Explore More

Categories

Switch to the categories hub to compare Nav inspiration against a different browsing dimension.

Explore More

Styles

Switch to the styles hub to compare Nav inspiration against a different browsing dimension.

Explore More

Sections

Switch to the sections hub to compare Nav inspiration against a different browsing dimension.

Nav Inspiration FAQ

What makes marker pages different from normal tag pages?

Marker pages point to captured UI moments inside real page versions, so you can jump directly to a specific Nav reference instead of scanning an entire page manually.

How many Nav marker references are included here?

This collection currently includes 16 curated Nav marker references tied to real version data and timestamps.