Maria Reyes

How did you get started with tropical colour design?

I started in 2010 at a Manila digital agency, working on tourism websites. We’d use these beautiful coral and teal tones, and honestly, they looked amazing on mockups. But when clients checked on their phones at the beach — terrible contrast, hard to read. That’s when I realized: vibrant doesn’t mean broken.

I spent years studying how sunlight hits water, how our eyes perceive warm versus cool tones on small screens, and what actually works in the Philippines’ bright daylight. The breakthrough came when I stopped thinking about colours as decorations and started treating them like a system — intentional, testable, accountable.

What’s the challenge with vibrant palettes on mobile?

Two things. First, screen brightness changes how colours feel. A coral that’s stunning on a desktop display can look washed out on a phone in sunlight, or too intense indoors. You’ve got to test across lighting conditions, not just RGB values.

Second, contrast ratios get tricky. I wanted to use a gorgeous sunset coral (#e11d48) as an accent, but on white backgrounds it only hits 4.8:1 contrast. That’s just barely WCAG AA. So we layer — use coral for headings and icons, darker shades for body text. The palette stays tropical, readability stays solid.

Why focus specifically on Philippine-inspired design?

The Philippines has this incredible natural palette. Turquoise waters, sunset gradients that change every evening, lush jungle greens. It’s not just beautiful — it’s authentic to the people and brands I’m designing for. When a Filipino company uses these colours, they’re not borrowing aesthetics from somewhere else. They’re representing home.

Plus, the climate here is intense. Bright sun, high humidity, tropical weather. The websites I design need to work in those conditions. A colour system that looks good on a phone at noon in Manila? That works everywhere.

What does your typical colour strategy process look like?

We start with what the brand wants to feel like. Energetic? Calming? Trustworthy? Then I pull inspiration from Philippine landscapes — specific islands, specific times of day. Not generic “tropical,” but actual colours from actual places.

I build a full palette: primary colours, secondary accents, neutrals, semantic colours (success, warning, error). Then comes the hard part — testing. We run contrast checks at WCAG AA and AAA levels. We test on 15+ devices across iOS and Android. We check gradients at different zoom levels. We even print samples and hold them up to sunlight.

Once the system’s locked, we create guidelines for the team. How to pair coral with teal. When to use white backgrounds versus off-white. How gradients should transition. That’s where the framework lives.

What’s something people get wrong about vibrant design?

They think “vibrant” means every colour at full saturation. That’s actually exhausting to look at. Real vibrant design is about smart contrast — a bold coral accent against clean white, surrounded by breathing room. The colours pop because they’re not fighting each other.

Also, people skip the mobile testing. They design on big screens where everything looks amazing, then ship it. That’s how you end up with text you can’t read on a phone. The tropical palette I develop works on a 320px screen first, then scales up beautifully to desktop.