Lazada color palette
EcommerceLazada's color identity features a vibrant blue as its primary color, complemented by a bold orange and a range of supporting colors for UI clarity and brand recognition. The palette is designed for high visibility and digital-first consistency across Southeast Asia.
lazada.comLazada colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Lazada BluePrimary26, 156, 183
- Lazada OrangeSecondary243, 111, 54
- Lazada YellowAccent249, 179, 0
Surfaces
Page, cards and dividers.- Lazada Light GrayBackground245, 245, 245
- Lazada WhiteSurface255, 255, 255
- Lazada Border GrayBorder229, 229, 229
Text
Three tiers of copy.- Lazada CharcoalText34, 34, 34
- Lazada Medium GraySecondary text117, 117, 117
- Lazada Muted GrayMuted text189, 189, 189
Semantic
Feedback and state colors.- Lazada GreenSuccess0, 178, 106
- Lazada Warning YellowWarning255, 179, 0
- Lazada RedError244, 67, 54
- Lazada Info BlueInfo25, 118, 210
Use Lazada's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
lazada-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1976D2;
--error: #F44336;
--accent: #F9B300;
--border: #E5E5E5;
--primary: #1A9CB7;
--success: #00B26A;
--surface: #FFFFFF;
--warning: #FFB300;
--secondary: #F36F36;
--text-muted: #BDBDBD;
--background: #F5F5F5;
--text-primary: #222222;
--text-secondary: #757575;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.6:1
Pass
Text on surface
Needs 4.5:1 for body text
15.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.2:1
Fail
Secondary text on surface
Needs 4.5:1 for body text
4.6:1
Pass
Muted text on background
Needs 3:1 for large text
1.7:1
Fail
Muted text on surface
Needs 3:1 for large text
1.9:1
Fail
Lazada gray and neutral colors
The quiet part of the Lazada palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Lazada Light GrayBackground
- HEX
- RGB
- HSL
- Lazada WhiteSurface
- HEX
- RGB
- HSL
- Lazada Border GrayBorder
- HEX
- RGB
- HSL
- Lazada CharcoalText
- HEX
- RGB
- HSL
- Lazada Medium GraySecondary text
- HEX
- RGB
- HSL
- Lazada Muted GrayMuted text
- HEX
- RGB
- HSL
About Lazada's colors
Lazada's palette is built around a strong blue and orange pairing, evoking trust and energy. The supporting colors ensure accessibility and visual hierarchy in digital interfaces.
Primary blue contrasts with secondary orange for call-to-action emphasis.
Accent yellow highlights promotions and deals.
Neutral grays provide balance and readability.
Psychology
Blue conveys reliability and professionalism, important for ecommerce trust. Orange and yellow add vibrancy and a sense of urgency, encouraging user interaction.
Evolution
Lazada's palette has remained consistent since its major rebrand in 2018, focusing on digital clarity. Minor adjustments have been made to gray tones for improved accessibility.
Where Lazada uses each color
- Primary
Lazada Blue is used for navigation bars, primary buttons, and key highlights across the website and app.
- Secondary
Lazada Orange appears in call-to-action buttons, banners, and promotional graphics.
- Accent
Lazada Yellow is used for badges, highlights, and special offers.
- Backgrounds
Lazada Light Gray and White are used for page backgrounds and content surfaces.
- Text
Charcoal and Medium Gray are used for primary and secondary text, ensuring readability.
- Semantic
Green, Yellow, and Red are used for success, warning, and error states in forms and notifications.
Lazada color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Lazada brand color is Lazada Blue, hex code #1A9CB7.
Lazada Blue is RGB(26, 156, 183) and in CMYK it is approximately (86, 15, 0, 28).
Lazada uses Light Gray (#F5F5F5), Border Gray (#E5E5E5), Medium Gray (#757575), and Muted Gray (#BDBDBD) for backgrounds, borders, and text.
Use Lazada Blue (#1A9CB7) for primary actions and navigation, with Orange (#F36F36) for secondary emphasis and calls to action. Grays and whites provide structure and clarity in backgrounds and text.
The secondary color is Lazada Orange, #F36F36, and the accent is Lazada Yellow, #F9B300. Together with the primary they make up the three brand colors at the top of this page.
3 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Lazada's colors consistently when it generates UI.
Make something in the spirit of Lazada
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.