Jolly Gringo'z

Round two

Three Palettes,
Three Homepages

Every colour below comes out of the logo. Same four hues in all three, just a different one carrying the page. Nothing here is a new colour family, so whichever you pick, the bottles, the labels and the packaging still match.

Palette 01

Mercado

Yellow carries the page and white is the rest stop. Loudest, most poster-like, hardest to ignore in a feed. Best if the brand wants to feel like a party.

See it live
Brand Yellow#FBBC42Page ground, header, merch band
Action Red#C42D12Every button, every add to cart
Ink#182022Type, borders, the dark rest sections
Agave Blue#5773AECategory accent, never an action
Yellow Pale#FEF0D5Product stages and soft bands
White#FFFFFFCards and breathing room

Action

Red only. If it is red, it does something.

Detail

Yellow is the ground and the highlight, never a primary button on light.

Structure

3px ink borders and hard offset shadows. No gradients anywhere.

SamplePairRatioWCAG
Ink on brand yellow#182022 on #FBBC429.75:1AA
White on action red#FFFFFF on #C42D125.63:1AA
Yellow on ink#FBBC42 on #1820229.75:1AA
Ink on white#182022 on #FFFFFF16.55:1AA
White on agave deep#FFFFFF on #40598F6.9:1AA
Palette 02

Smokehouse

Ink carries the page, yellow is the light in the dark. Most premium and most cinematic. Photography looks expensive on it. Best if the brand wants to feel like craft barbecue.

See it live
Ink Deep#0E1416Page ground and footer
Ink Slate#1E2A2ECards, mega menu, review tiles
Brand Yellow#FBBC42Headline accent, add to cart, glow
Action Red#C42D12Primary CTA and the newsletter band
Agave Blue#5773AECool edge in the hero wash
Body Grey#B9C2C4Body copy on dark, 10.2:1

Action

Red for the primary CTA, yellow for add to cart inside dark cards.

Detail

Yellow glow on hover, blue only in the background wash.

Structure

One white break band for the merch, so the dark never gets claustrophobic.

SamplePairRatioWCAG
White on ink deep#FFFFFF on #0E141618.58:1AA
Yellow on ink deep#FBBC42 on #0E141610.95:1AA
Body grey on ink deep#B9C2C4 on #0E141610.24:1AA
White on action red#FFFFFF on #C42D125.63:1AA
Ink on yellow, add to cart#182022 on #FBBC429.75:1AA
Palette 03

Shelf

White carries the page, ink does the talking, red does the selling. Quietest and the easiest to scan. Best if the priority is conversion rate over personality.

See it live
White#FFFFFFPage ground, cards, product stages
Stage Grey#F2F3F5Hero band, tables, merch band
Ink#182022Headlines, USP bar, newsletter band
Action Red#C42D12Add to cart, eyebrows, guarantee icons
Brand Yellow#FBBC42Guarantee band and the logo plate only
Body Grey#4A5658Body copy on white, 7.6:1

Action

Red, on a full width add to cart button in every card.

Detail

Yellow appears three times on the whole page. It points, it does not shout.

Structure

Short hero so the grid lands above the fold. Density over drama.

SamplePairRatioWCAG
Ink on white#182022 on #FFFFFF16.55:1AA
Body grey on white#4A5658 on #FFFFFF7.6:1AA
White on action red#FFFFFF on #C42D125.63:1AA
Agave ink on white#40598F on #FFFFFF6.9:1AA
Ink on yellow band#182022 on #FBBC429.75:1AA

Compare

Open the Three Designs

All three are complete, working homepages. Same products, same photography plan, same Shopify structure. Only the ground and the architecture change.

Cantina RadioTap to turn the music on