Style guide
The Prance-Lux theme is built from design tokens in /assets/css/tokens.css. Every colour, font and spacing value lives there, so the palette can be changed in one place and the tokens can be carried over to a Shopify or WooCommerce theme. The palette has been approved.
Logo
Colour
- Navy slate
--pl-navy#2D4B6FHeader, primary surfaces - Deep navy
--pl-ink#1B2F47Body text, footer - Ivory
--pl-ivory#FAF8F4Page background - White
--pl-white#FFFFFFCards, panels - Accessible teal
--pl-teal#0E7563Buttons and accents on light backgrounds - Accessible blue
--pl-blue#0B6FB8Links - Light teal
--pl-teal-light#5FD0C0Accents and text on navy only - Thread teal
--pl-thread-teal#349689Decorative only, never text - Thread blue
--pl-thread-blue#0092DDDecorative only, never text
Typography
Cormorant Garamond for headings
Nunito Sans for body text and interface. Its rounded forms echo the handwritten Prance-Lux wordmark.
The thread line
A thin gradient thread, taken from the logo's loop, underlines section headings and divides content. It is decorative and hidden from screen readers.
Buttons
Primary buttonSecondary button
Placeholders
Missing information is shown as [TBC] so nothing is published without real data.
Accessibility rules
- Text contrast is at least 4.5:1; the thread colours are never used for text.
- Every interactive element has a visible focus ring and works with a keyboard.
- Motion is removed for people who prefer reduced motion.
- Pages use one h1, landmarks and a skip link.