Color
Main Colors
HM21’s primary colors - Light Blue, White, and Black - form the core of our visual identity. Light Blue reflects clarity, innovation, and trust. White provides openness and space, while Black adds strength and contrast. Together, they create a clean, modern, and balanced foundation for all brand communications.
Lumen is HM21’s secondary color - a key support element that amplifies the brand’s “light” concept. It should be used sparingly to highlight key elements and convey clarity, positivity, and energy.
| hex: | #C3E4F3 |
|---|---|
| rgb: | 195, 228, 243 |
| hex: | #FCFF92 |
|---|---|
| rgb: | 252, 255, 146 |
| hex: | #0a0a0a |
|---|---|
| rgb: | 10, 10, 10 |
| hex: | #FFFFFF |
|---|---|
| rgb: | 255, 255, 255 |
Colour Proportion
Light Blue is the lead tone, symbolizing trust and innovation.
Black adds strength, while White ensures clarity and openness. Always lead with Light Blue to maintain a clean, modern, and professional brand presence.
Lumen is used as an accent color to enhance and highlight the brand concept.
Supporting Colors
They bring structure and contrast to compositions, allowing annotations to stand out where it matters most. They can be used sparingly as a high-impact accent to introduce depth and energy, but should never be used as a full background fill.
| hex: | #6290C8 |
|---|---|
| rgb: | 98, 144, 200 |
| hex: | #2B4686 |
|---|---|
| rgb: | 43, 70, 134 |
| hex: | #A4F385 |
|---|---|
| rgb: | 164, 243, 133 |
Sunrise Gradient
HM21’s gradient system combines Light Blue, Lumen, and White to express our core visual narrative - clarity, light, and movement. These gradients bring depth and softness while enhancing brand distinctiveness across all touchpoints. Use gradients purposefully to highlight key moments and reinforce the brand’s light-inspired identity.
Do & Donts
Use only the approved blue–yellow–white gradient in backgrounds and graphic elements. Do not use black gradients or introduce any unapproved colors into gradient compositions.
Type & Colour
When combining colours, keep accessibility in mind. Generally, a white background can accommodate all core colours and vice versa. Avoid using combinations that are low contrast.
Good Combinations
Some recommendations on how to combine our colours.
Bad Combinations
Avoid these combinations as they are too low contrast or can cause fatigue.
