Food & drink

COVA

The packaging existed before the website did, which is the harder direction to work in. So nothing on the site was designed beside the packs; every value was read out of them.

Category: Food & drink
Year: 2026
Scope: 4 workstreams

Scope

Brand system
Packaging art direction
Website
Asset pipeline

Built with

Next.js
TypeScript
Tailwind CSS
Sharp
Vercel

The brief

COVA had finished artwork for eight products and needed a site that did not look like a different company had made it. The usual failure here is a designer picking colours that sit near the packaging and calling it a match; up against the real thing, near is worse than wrong.

We built the palette by sampling: four core browns, then one deep and one soft value per flavour, taken straight from the printed artwork. Burnt was reserved for lettering on Amber, because it is the only pair in the set that measures.

Approach

Four decisions the whole project rests on.

01
An asset pipeline, not a folder
A script trims the drawn wordmark, resizes the photography, and keys the studio ground out of every pack shot, so re-shooting a product is one command rather than an afternoon.
02
Two keying modes
Bars are photographed on their own flavour colour, so the key leans on the drop shadow to find the wrapper edge; cream and white shots key on chroma instead, which takes the shadow with it.
03
Packs as objects
Every product is a cut-out laid on brand colour at whatever size the layout wants, rather than a rectangle cropped to fit a box.
04
A wordmark that prints in any colour
The drawn lettering is applied as a CSS mask over currentColor, so one file sets the name in all eleven brand values.

Art direction