All projects
E-commerce · Food and drink
Verdant
Drinks brand · direct to consumer
A DTC drinks brand where choosing a flavour restyles the entire page, from the bottle to the buy bar. Theming as a product feature rather than a toggle.
The brief
What it had to do.
Four flavours, one product, and a brand whose entire personality is the fruit. The site had to change character with the selection rather than show four photographs of the same bottle.
Design approach
The decisions behind it.
- One custom property drives the palette, so a flavour change moves everything at once
- Round, warm and saturated against a pale cream ground
- A sticky buy bar that stays reachable without covering the product
Signature interaction
Flavour selection that recolours the whole page
Selecting a flavour recolours the bottle, the ground, the pills, the figures and the primary action in one transition, and the nutrition panel updates with it.
On a phone
Usable before anything loads.
The bottle moves above the copy and the buy bar stays pinned to the base.
Next.jsCSS custom propertiesSVG product art
