PostHog

How it works

hero:

Left-aligned text hierarchy (logo, 38pt headline, paragraph copy) with dual-action buttons (orange primary, white secondary outline) positioned above a four-tab feature section; right side hosts large illustrative scene of people working at desks with stacked compositions.

layout:

60/40 horizontal split with text + CTAs dominating left column; feature tabs create a horizontal divider (one tab highlighted in blue, others in white); illustration occupies right edge as continuous vertical ribbon; desktop file explorer sidebar on left contains navigation iconography mimicking operating system metaphor.

type:

Heavy sans-serif (bold weight) for headline contrasted against regular weight body copy in darker gray; tab labels use medium weight; link underlines (MCP, Watch a demo) maintain hierarchy without color distraction; monospace or technical fonts reserved for feature names within tabs.

colors:

Warm beige/tan background grounds the layout; electric blue tab strip provides structural accent and navigation clarity; orange buttons (primary CTA) repeat top-right corner and hero section; muted earth tones in illustrations (browns, greens, skin tones) create personality without competing with text.

distinctive:

The OS-like left sidebar with stacked file icons and labels (home.mdx, Product OS, Pricing, Docs, etc.) that frames the entire design as a 'file system view' of the product—making abstract concepts feel navigable and explorable like a real interface.