⚡Quick answer -

HeyoPhone’s colors are designed to feel energetic, clear, and easy to understand. Each color has a purpose, so the interface not only looks good but also guides users naturally.

When should I use this guide?

Reference these details any time you are designing, reviewing, or developing anything that must follow the official HeyoPhone color palette—UI screens, marketing assets, slide decks, or internal prototypes.

1. Primary color – Heyo Blaze

The core of the brand is orange (Heyo Blaze). It’s bright, energetic, and hard to miss. We use it for key actions like buttons, highlights, and important interactions. This helps users quickly understand where to click or what to focus on. It also gives the brand a lively and confident personality.

2. Base colors – black, white, & greys

Base colours (black, white, and greys). These form the foundation of the UI.

• White and light greys are used for backgrounds to keep things clean

• Dark greys and black are used for text and structure. This creates strong readability and ensures the interface doesn’t feel cluttered, even when there’s a lot of information.

3. Secondary color – dark blue

HeyoPhone also uses dark blue. This is used more subtly to:

• Differentiate sections or features

• Add visual variety

• Support the primary orange without overpowering it. It helps the UI feel more dynamic while still keeping orange as the main focus.

4. Semantic colours – functional meaning

These colors make it easy for users to understand what’s happening at a glance, without needing to read too much.

5. When should a colour NOT be used?

Because dark blue is meant to “support the primary orange without overpowering it,” never let blue replace orange for key actions. Likewise, avoid using semantic reds, yellows, or greens for anything other than their stated functional meaning—doing so would confuse the user.