Sunset Pier
First screensTravel and lifestyle heroes; warm foreground against a cool distance.
Click a swatch to copy its hex.
Do not use this for
Dense tables — two strong families make rows hard to scan.
What was measured
- Closest neighbours
- ΔE00 12.2
- how alike two adjacent swatches look
- Darkest to lightest
- 4.52:1
- WCAG contrast across the set
- Lightness covered
- 58 pts
- of OKLCH lightness, 0–100
- Under colour blindness
- ΔE00 8.9
- worst under protanopia
These two are one colour to a reader with protanopia. Fine while the set is read as an order; never use them to mean two different things without a label or an icon as well.
A suggested mapping · derived, then measured
Five colours are not an interface, so this is an offer rather than a token set. It clears WCAG AA as it stands.
/* Sunset Pier — Travel and lifestyle heroes; warm foreground against a cool distance. */
:root {
--palette-1:Tailwind
// tailwind.config — Sunset Pier
export default {
theme: {For your coding agent · printed from the colours
Use the Sunset Pier palette: #78003A, #B5005A, #FBEEDA, #004395, #68A5FF. It is for this: Travel and lifestyle heroes; warm foreground against a cool distance.
How this palette was built · no hex was chosen by hand
The catalog states a recipe — scene from hue 2 and 258 — and the five colours are derived from it in OKLCH, where a step of lightness is a step your eye agrees with rather than one the hex numbers agree with. That is why the numbers above are properties of this palette rather than claims about it.