Chambray is a soothing, soft blue shade, sitting between blue and gray on the color wheel. It evokes calm and serenity, similar to denim. Shades range from light sky to muted periwinkle. Perfect for creating a relaxed vibe in designs like backgrounds or accents.
Chambray is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- Hex Code: #A4C8E1
- RGB value: 64.3% red, 78.4% green, 88.2% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines
For variations within the same spectrum as Chambray, consider:
- Misty blue (#b5c7eb): Embraces a soft, airy feel with its gentle blue tint, matching Chambray's understated elegance and approachability.
- Powder Blue (#b8e3e9): Shares a delicate and calming lightness reminiscent of Chambray, providing a serene and breezy vibe.
- Light blue (#90d5ff): Offers a crisp, clean pastel-like quality that aligns with Chambray's subtle and refreshing tone.
- Periwinkle (#ccccff): Combines blue and purple hues, echoing Chambray's gentle blend of soft tranquility and classic allure.
To complement Chambray, consider pairing it with:
- Mint Green (#ADEBB3): This fresh, cool green balances Chambray's warmth, creating a gentle and calming palette.
- Coral (#FF8559): This warm, vibrant hue contrasts with Chambray’s cooler tones, adding a lively and energetic feel.
- Lavender (#D3D3FF): This soft purple shade adds a serene touch, enhancing Chambray's relaxed vibe with its light and airy presence.
- Pale Yellow (#FFFFC5): This warm, subtle hue complements Chambray's cool tones, offering a soft and inviting visual contrast.
While Chambray is light and airy, it may clash with:
- Neon Orange (#FF5C00): The intense, vibrant nature of neon orange can overpower Chambray's calm softness, leading to a visually jarring pairing.
- Vermilion (#E73121): Vermilion's strong warmth can create a stark and uncomfortable contrast with the cool tones of Chambray, disrupting visual harmony.
- Bright Yellow (#FFED29): Bright yellow's high energy and brightness can overshadow Chambray's subtlety, making the combination difficult to balance effectively.
- Crimson Red (#B22222): The depth and intensity of crimson red may clash with Chambray's gentle, understated quality, resulting in a heavy and mismatched visual aesthetic.
- Electric Blue (#00F0FF): Electric blue's bold vibrancy can compete with Chambray, leading to a distracting and overwhelming visual effect due to their similar saturation levels.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Glacial Drift
Frosted Blush
Tidal Quartz
Contrast checker
- Large Text
Figma
- Normal Text
How you design, align, and build matters. Do it together with Figma.
1.76:1
WCAG 2.2 Simple Contrast
Normal Text
- Fail
- AA
- 4.5:1
- Fail
- AAA
- 7:1
Large Text
- Fail
- AA
- 3:1
- Fail
- AAA
- 4.5:1
- Large Text
Figma
- Normal Text
How you design, align, and build matters. Do it together with Figma.
11.93:1
WCAG 2.2 Simple Contrast
Normal Text
- Pass
- AA
- 4.5:1
- Pass
- AAA
- 7:1
Large Text
- Pass
- AA
- 3:1
- Pass
- AAA
- 4.5:1
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #A4C8E1, known as Chambray, has RGB values of R:164, G:200, B:225 and CMYK values of C:27, M:11, Y:0, K:12.
| VALUE | CSS | |
|---|---|---|
| HEX | #A4C8E1 | #A4C8E1 |
| RGB DECIMAL | 164, 200, 225 | RGB(164,200,225) |
| RGB PERCENTAGE | 64.3, 78.4, 88.2 | RGB(64.3%,78.4%,88.2%) |
| CMYK | 27, 11, 0, 12 | |
| HSL | HSL(204.6, 50.4%, 76.3%) | HSL(204.6, 50.4%, 76.3%) |
| HSV (OR HSB) | 204.6°, 27.1, 88.2 | |
| WEB SAFE | #153204204 | #153204204 |
| BINARY | 10100100, 11001000, 11100001 | |
| iOS - SwiftUI | Color(red: 0.643, green: 0.784, blue: 0.882) | |
| iOS - UIKit | UIColor(red: 0.643, green: 0.784, blue: 0.882, alpha: 1) | |
| Android - Compose | Color(0xFFA4C8E1) |
