Jude's ask, verbatim: "can you look into what a better color rendering would look like. Mixing black, white, creme, brown, and green. Images will do. You dont need to push it the website."
Below are five new color directions plus "Today" for comparison — all built and screenshotted on the real, live landing page (nothing simulated or mocked up). Nothing here is deployed or pushed anywhere; this is images only, for a look and a reaction.
We built the real Greenlight frontend locally, then for each direction we swapped only the site's color variables (the ground color, card color, text color, hairline color, gold accent, and so on) and re-photographed the exact same page, section by section, at both desktop and mobile size. Every screenshot below is what the real site would actually render with that palette — not a mockup.
One real constraint worth knowing: the site currently uses a single text color across the whole page, whether that text sits on the page background or inside a card. That means every direction below had to pick one text color that stays readable in both places — we couldn't, for example, do a dark brown page background with light cream cards and have text look right on both without a small code change first (adding a second text-color variable). Every variant here works within that real constraint rather than faking a look that wouldn't actually render.
Contrast numbers under each variant are the standard accessibility measurement (WCAG relative-luminance contrast ratio); 4.5:1 is the bar for normal body text.
One rendering note: the traffic-light artwork carries its own fixed cream backdrop baked into the image, so on lighter grounds (Porcelain especially) you'll see a faint warmer box behind the signal — that's the asset, not the palette.
the current site — for comparison
This is the site as it looks right now, shown so the other five have something to be compared against. Warm cream everywhere, dark brown-black text, brand green kept mostly for buttons and the traffic light.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 2.01:1 against the 4.5:1 accessibility minimum for normal text — and it does not clear the bar, the same as it doesn't on the current live site today.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 13.59:1 | Passes AA |
| Body text on card background | 14.94:1 | Passes AA |
| Muted/secondary text on background | 8.04:1 | Passes AA |
| Gold accent text on background | 5.63:1 | Passes AA |
| Deep-green ink text on background | 10.91:1 | Passes AA |
brown-forward — the warm coffee-shop version
Cozy, a little bit date-night-at-dusk. The green button and the traffic light both pop harder against dark brown than they do on cream, and every piece of text we checked stays easy to read. The tradeoff: this is a much bigger mood swing than the others — it reads more “craft coffee brand” than “dating app,” and would want a gut check with real people before going further.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 7.28:1 against the 4.5:1 accessibility minimum for normal text — and it actually clears the bar here, because green reads well against a dark ground.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 13.35:1 | Passes AA |
| Body text on card background | 11.09:1 | Passes AA |
| Muted/secondary text on background | 8.01:1 | Passes AA |
| Gold accent text on background | 8.78:1 | Passes AA |
| Deep-green ink text on background | 10.24:1 | Passes AA |
near-black — a taste of real dark mode
Near-black with warm off-white text and a brighter mint-green accent. This is genuinely the best-looking version of the traffic light section — the red, amber and green lamps glow like they're supposed to. It's premium-looking, but it's a bigger identity shift than a color tune-up — this reads as a deliberate dark-mode option, not a retheme of the current cream site.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 8.61:1 against the 4.5:1 accessibility minimum for normal text — and it actually clears the bar here, because green reads well against a dark ground.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 17.38:1 | Passes AA |
| Body text on card background | 15.70:1 | Passes AA |
| Muted/secondary text on background | 9.29:1 | Passes AA |
| Gold accent text on background | 10.23:1 | Passes AA |
| Deep-green ink text on background | 10.24:1 | Passes AA |
white-forward and airy
The lightest and airiest option — closer to true white than today's cream, with warm walnut-brown text instead of near-black. It reads a little more modern-lifestyle-app and a little less vintage-stationery than today. Contrast is excellent everywhere we measured. If the goal is to feel brighter and more open without losing the brown/cream warmth, this is the safe, obvious next step.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 2.22:1 against the 4.5:1 accessibility minimum for normal text — and it does not clear the bar, the same as it doesn't on the current live site today.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 13.52:1 | Passes AA |
| Body text on card background | 11.68:1 | Passes AA |
| Muted/secondary text on background | 6.72:1 | Passes AA |
| Gold accent text on background | 5.25:1 | Passes AA |
| Deep-green ink text on background | 12.09:1 | Passes AA |
green-washed neutrals
Same cream cards as today, but the page background shifts from warm cream to a soft, desaturated sage green. Honestly, this is the weakest of the five: at a glance it can read as “today, but slightly duller” rather than a clear new direction, and the green-tinted ground competes with the brand-green accent instead of setting it off. We'd cut this one first unless the team specifically wants a quieter, more muted feel.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 1.72:1 against the 4.5:1 accessibility minimum for normal text — and it does not clear the bar, the same as it doesn't on the current live site today.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 10.91:1 | Passes AA |
| Body text on card background | 12.34:1 | Passes AA |
| Muted/secondary text on background | 5.72:1 | Passes AA |
| Gold accent text on background | 4.83:1 | Passes AA |
| Deep-green ink text on background | 9.36:1 | Passes AA |
high-contrast cream, black type, brown structure
Cream and near-black with bold brown structural lines instead of today's soft tan hairlines — think a nicely printed invitation. Green is dialed back to just the Accept button and the traffic light, so it reads as a real accent instead of a mascot color. This is the most editorial, highest-contrast version, and probably the safest one-notch-bolder update if the goal is to sharpen up the current look rather than replace it.
Pre-existing site quirk, not introduced by this variant: the site already uses the raw brand green as text color in two spots (the italic word in the headline, and the small all-caps section labels). On this variant's background that pairing measures 2.06:1 against the 4.5:1 accessibility minimum for normal text — and it does not clear the bar, the same as it doesn't on the current live site today.
| Pairing (this variant's own colors) | Contrast ratio | Result |
|---|---|---|
| Body text on page background | 17.86:1 | Passes AA |
| Body text on card background | 18.95:1 | Passes AA |
| Muted/secondary text on background | 9.10:1 | Passes AA |
| Gold accent text on background | 8.96:1 | Passes AA |
| Deep-green ink text on background | 11.18:1 | Passes AA |