Landing Pages
Covers: landing pages, marketing pages, stacked page sections, heroes, CTAs, pricing sections, feature sections, full-page consistency.
- Reuse one primary/secondary button style across the whole page: if the hero's secondary is link-style, every section's secondary action (CTA, pricing, etc.) is link-style too.
- Reuse the same font treatment (size, weight, color) wherever the same or similar idea repeats: match the existing instance exactly.
- Reuse one container style across the page: once set (outline, tinted, etc.), all later containers match.
- Use one border radius for all sibling containers at the same level (panels, cards).
- Use one column
gap-*across all multi-column sections (card grids, split layouts): check existing sections and match the value already in use before adding a new one. - Never place a centered layout directly below a left-aligned one; use left-aligned, unless the section above ends with full-width containers, a background color change, or a visible divider separates them.
- Never have more centered heading groups than left-aligned on a landing page: center heroes, CTAs, and symmetrical content (centered pricing cards, logo clouds); default to left-aligned for feature grids, split layouts, and content-heavy sections.