Brand system / Colour
The Holistic Smart colour architecture: technical values (HEX, RGB, CMYK, CSS tokens), tint scales, accessibility contrast ratings, and dosage rules for our core 3 Blues and 2 Greens identity system.
Our colour architecture is engineered around 3 Blues and 2 Greens, each with a defined operational job within our communications, brand identity, and user interfaces.
Brand Navy (#003375) anchors the entire visual system. It represents enterprise security, engineering stability, the "SMART" division badge, and inner shield structure.
Cerulean Blue (#069EEA) articulates dynamic infrastructure movement and the outer shield contour, bridging deep authority with luminous digital flow.
Holistic Sky (#11A7FF) injects energy, digital intelligence, and modern connectivity. It illuminates interactive states, primary actions, and ICT division highlights.
Holistic Lime (#99CC00) signals vitality, energy efficiency, and active system health. It serves as the primary "HOLISTIC" wordmark and main checkmark core for ELV and BMS services.
Deep Lime (#78B023) provides physical depth and shading along the checkmark facet, delivering high-contrast accessible green typography and precision engineering indicators.
The core brand colors extracted directly from our master vector identity. Click any token value below to copy it instantly to your clipboard.
Enterprise Authority & Inner Shield
Infrastructure Flow & Outer Shield
Digital Connectivity & ICT Highlights
Active Vitality & Main Checkmark Body
Kinetic Dimension & Checkmark Shading
Structural background tones, border hairlines, dark footers, engineering slate accents, and system status indicators.
Engineering accent & technical sub-bands
Deep footer, terminal bars, dark UI
Default alternating section canvas
Universal 1px divider for cards & tables
High-contrast headings & primary type
Calibrated stepped opacities for subtle background chips, badges, and table zebra-striping. Click any step to copy its hex value.
Brand Navy Tints (#003375 — Blue 1)
Cerulean Blue Tints (#069EEA — Blue 2)
Holistic Sky Tints (#11A7FF — Blue 3)
Holistic Lime Tints (#99CC00 — Green 1)
Deep Lime Tints (#78B023 — Green 2)
All text pairings across our 3 Blues and 2 Greens must meet WCAG AA (minimum 4.5:1 for body copy, 3.0:1 for large display headlines). Below is our certified contrast verification table.
| Foreground Text | Background Surface | Contrast Ratio | WCAG AA Status | WCAG AAA Status | Approved Purpose |
|---|---|---|---|---|---|
| White (#FFFFFF) | Brand Navy (#003375) | 12.8 : 1 | Pass (AAA) | Pass (AAA) | Hero banners, inverted CTA buttons, primary dark sections. |
| Deep Ink (#0D1B33) | Pure White (#FFFFFF) | 15.9 : 1 | Pass (AAA) | Pass (AAA) | Standard reading body copy, section titles, table rows. |
| Brand Navy (#003375) | Soft Ice (#F6F9FD) | 11.7 : 1 | Pass (AAA) | Pass (AAA) | Headings and cards on soft background canvas. |
| Deep Ink (#0D1B33) | Holistic Lime (#99CC00) | 9.2 : 1 | Pass (AAA) | Pass (AAA) | Lime action buttons, active tags, status chips. |
| Deep Ink (#0D1B33) | Deep Lime (#78B023) | 5.4 : 1 | Pass (AA) | Pass (Large) | High-contrast text on secondary green chips and banners. |
| Brand Navy (#003375) | Holistic Sky (#11A7FF) | 5.4 : 1 | Pass (AA) | Pass (Large) | Sky accent badges, high-contrast digital labels. |
| Brand Navy (#003375) | Cerulean Blue (#069EEA) | 4.0 : 1 | Pass (Large) | Fail (Small) | Large headings ≥ 18px bold on cerulean banners. |
| White (#FFFFFF) | Deep Lime (#78B023) | 3.6 : 1 | Pass (Large) | Fail (Small) | Bold graphical icons ≥ 24px and large display buttons ≥ 18px bold. |
| White (#FFFFFF) | Cerulean Blue (#069EEA) | 3.2 : 1 | Pass (Large) | Fail (Small) | Large display text and prominent UI icons. Prohibited for body copy. |
| White (#FFFFFF) | Holistic Sky (#11A7FF) | 2.8 : 1 | Fail (Small) | Fail | Prohibited for body text. Permitted only for bold icons ≥ 24px and large display buttons ≥ 18px bold. |
To maintain a clean architectural aesthetic, adhere strictly to the 60-30-10 proportion rule across all layouts, balancing our 3 Blues and 2 Greens.
Rules for harmonious and accessible colour execution.
