The calm structure you liked, in the client's colour and nothing else of theirs.
What changed, and what didn't
Everything that made the last one restful is untouched: one hue family, one typeface with weight carrying hierarchy, surfaces sitting close together, pills, one soft shadow, hairlines doing all the dividing. Manrope stays. The type ladder stays. The board layout stays.
What changed is the family: champagne and near-black instead of teal. That sounds like a token swap and it is not one, because gold cannot do the job teal was doing. The palette had to be restructured around that, and it is the only interesting thing on this page.
Palette
In the teal version one token, --action, was both a fill and a text colour at 5.23:1 either way. Champagne cannot be that token: #BEAD8E on the ground is 2.07:1, so it can never be text on a light surface. Rather than darken it until it stops being their colour, the job splits in two.
The primary button is champagne with near-black text — 8.59:1, and it is the hotel's own button, made legible. Hovering deepens to #B9975B, still 6.87:1.
Focus rings, hairline rules, headings and every piece of structure are near-black. The interface reads achromatic; the brand arrives as a fill.
Where gold has to be text — links, eyebrows, the brand line — it is #786D58 at 4.79:1. Same hue, enough weight to read.
Two measured rules fall out. Gold is never text on a light surface — that is the 2.07:1 above. And state colours never sit on the wash: amber on it is 4.34:1 and gold-spoken on it is 4.40:1, both just short, so chips live on paper or ground. Everything else clears 4.5:1 in both directions.
The board
Free time is still the only filled thing. Here the fill is the pale wash and the full champagne is reserved for the action — so the page has a two-step gold hierarchy: pale means available, saturated means press this.
Sport dots are re-warmed to sit inside this family — olive, plum, terracotta, amber-brown and slate, every one above 4.3:1 on the ground, well past the 3:1 that non-text information needs. The written label still does the identifying.
State
A deliberate exclusion. Champagne is the identity, so it never carries information — if gold meant paid it would also mean brand, and a clerk scanning twenty rows would be reading the logo instead of the ledger.
The reference
Near-black card, gold hairlines above and below the label, white tabular code. This is the only place the logo's own construction survives at product scale — two rules and wide-tracked caps. The filigree does not appear anywhere; below about 120px it stops being legible, and this system has no room where it would be larger.
Booking reference
CB-B2-9F4KQ
Typography
Old Standard TT is the hotel's display face and it is not here, because you asked for the colour only — and because a high-contrast serif at 80px with −1px tracking is the opposite of the calm this structure earns. One family, hierarchy from weight.
Motion
Unchanged by the colour, because the constraint is the motion budget, not the palette: motion on public routes only behind LazyMotion, /admin and /clerk CSS-only, every animation checking useReducedMotion().
animate-digits on the checkout hold — a running timer is information. reveal with a shorter travel. animated-list for the guest's payment-proof feed, never the day sheet. shimmer-skeleton on the calendar, amplitude held inside the wash.
glow-button, dia-text-reveal, scramble-text and the .text-gradient utility — all four live only in components/home/hero.tsx. A turning halo and a travelling gradient band cannot coexist with one 6% shadow, and with no accent hue the sweep has nothing to travel between.
One pulse survives in the whole product: the guest's waiting for the front desk dot, where something really is pending on a person. Everything else is static.
Honest risks
Because gold cannot be text, links and interactive labels lean on a muted #786D58 rather than a bright action colour. That is elegant and it is a real usability tax — the "you can press this" signal is quieter than any competitor's. Worth testing with someone who has not seen the product.
The structure is the category's, freely admitted. Champagne is the only thing separating this from the competitor's page. If the hotel ever rebrands, the product has nothing else holding its identity up.
The hairlines are #DDD2BE at 1.5:1 and card edges #C9BA9C at 1.91:1 — already nudged up from the teal version for exactly this reason. On a smudged tablet under fluorescent light at 7pm they are still the first thing to disappear. Test on the real device before committing.
Unchanged from the calm version: four shipped components go, plus about thirty lines of globals.css. Choosing calm costs that work regardless of which hue wins.
Still open
| Question | Where it stands |
|---|---|
| The hotel's display face | Old Standard TT is deliberately absent. If the client wants to recognise itself more, that face on the landing hero only — never in a console — is the smallest change that would do it. |
| Multi-venue | Unsolved here. Champagne is one operator's colour, and the second client inherits it. The Price Board's livery idea — a band per venue inside one grammar — is still the only answer any of these directions has produced. |
| Dark theme | Still deferred. One ground, #F8F8F8. |
| Photography | Unchanged: typographic surfaces, photographs in a gallery only. |