The starter ships with a design system that has three opinions baked in. They’re worth understanding before you start changing things — the components stop working well together if you violate them.
1. One brand colour, used sparingly
The default theme has a single brand-* colour scale (teal) plus a single accent (coral-*). Buttons, links, badges, and focus rings all draw from those two scales.
The temptation when customising a starter is to introduce a third or fourth colour. Don’t. Two scales is enough to differentiate every interactive element while keeping the page from feeling busy.
2. Edge-to-edge sections, not floating cards
Most sections (pricing cards, feature grids, testimonial walls) extend full-width inside the page’s max-width container, separated by hairline <StripeDivider /> elements rather than visual gaps.
This makes the page feel like a continuous document rather than a slideshow. It also makes vertical rhythm easier to maintain — every section has the same padding-y, regardless of content.
3. Hand-drawn touches, sparingly
The starter has a handful of hand-drawn accents — the arrow on the pricing toggle, the term-highlight underline style, the wobble on certain badges. They’re deliberately rare. A site with too many “playful” elements reads as unserious; one with none reads as cold.
Use them when you want to draw attention to one specific thing. Save them for the moments that matter.