Mint blue is a vibrant and invigorating color that sits between blue and green on the color wheel, specifically near the turquoise and cyan region. With its blend of green and blue hues, its appearance creates a cool and refreshing style, evoking feelings of peace.
Mint blue is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #98FBCB
- RGB value: 59.6% red, 98.4% green, and 79.6% 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.
Here are some ways to incorporate mint blue into your UI designs:
- Evoke freshness. Mint blue’s invigorating and refreshing hue can help create a fresh and vibrant design. Since it can remind users of a tropical vacation or sunny day, it makes the perfect shade for designing websites or apps in the travel, leisure, and wellness spaces.
- Draw attention. Use the vibrancy of mint blue to guide users’ eyes to important elements like CTAs and noteworthy information without being visually overwhelming.
- Convey trust. Mint blue’s connection to feelings of calmness and security can help build trust.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same serene spectrum as mint blue, consider:
- Mint green (#ADEBB3) sways greener, exuding a pale green color that shares the same refreshing and tranquil qualities as mint blue.
- Turquoise (#40E0D0) blends blue and green to create a vivid and vibrant shade.
- Cyan (#00FFFF) is a greenish-blue shade that appears refreshing, capturing the essence of tropical oceans.
- Blue-green (#01B3B1) combines green and blue to create a rich, deep hue.
To complement mint blue, consider pairing it with:
- Pastel yellow (#FFEE8C) provides warmth to complement mint blue, creating a sunny and uplifting color scheme.
- Navy blue (#000080) creates a striking contrast to add depth to any design.
- Peach (#FFD3AC) offers a soft and subtle warmth when paired with mint blue.
- Pink (#FF8DA1) adds to the softness of mint blue, capturing a sweet and elegant color combination.
Other colors worth considering include seafoam for a monochromatic color palette, beige for a warm, neutral backdrop, and white for a crisp design that evokes a fresh and airy feel.
While mint blue is cool, it may clash with:
- Aquamarine (#66F1C2) shares a similar hue to mint, providing little visual contrast.
- Red (#FF2C2C) can clash with mint blue due to its strong contrast.
- Yellow (#FFFF00) may compete with mint blue, creating a harsh effect.
- Charcoal (#4A4A4A) can create too much visual contrast, overpowering mint blue’s soft hue.
Mint blue symbolizes tranquility and freshness. It also carries connotations of trust and creativity. In color psychology, mint blue has relaxing qualities, often promoting feelings of peace and serenity.
In UI design, mint blue’s symbolism and influence from nature is suitable for wellness and healthcare brands looking to promote a healthy and balanced lifestyle. You can also use this invigorating hue to add freshness to designs.
The cool blue and green tints of mint leaves inspire the color name “mint” and variations of this shade. Mint blue was first recorded around 1920 when mint hues became popular in the Art Deco era. These shades were often paired with black to create a striking yet sophisticated palette in interior design.
Mint blue is still used in various contexts today. You can see this pop of color used in fashion and design to create a breezy and airy look, as well as in hospital scrubs due to its calming and trustworthy effect.
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Minty Fresh
Garden Fresco
Whimsy And Wonder
Contrast checker
Contrast 1.24
- Large Text
#98FBCB
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 17
- Large Text
#98FBCB
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #98FBCB, known as mint blue, has RGB values of R:152 G:251, B:203 and CMYK values of C:39, M:0, Y:19, K:2.
| VALUE | CSS | |
|---|---|---|
| HEX | #98FBCB | #98FBCB |
| RGB DECIMAL | 152, 251, 203 | RGB(152, 251, 203) |
| RGB PERCENTAGE | 59.6, 98.4, 79.6 | RGB(59.6%, 98.4%, 79.6%) |
| CMYK | 39, 0, 19, 2 | |
| HSL | 150.9°, 92.5, 79 | HSL(150.9°, 92.5%, 79%) |
| HSV (OR HSB) | 150.9°, 39.4, 98.4 | |
| WEB SAFE | #99FFCC | #99FFCC |
| CIE-LAB | 91.675, -39.478, 13.97 | |
| XYZ | 58.222, 79.978, 68.866 | |
| xyY | 0.281, 0.386, 79.978 | |
| CIE-LCH | 91.675, 41.877, 160.513 | |
| CIE-LUV | 91.675, -46.261, 27.611 | |
| HUNTER-LAB | 89.431, -40.295, 16.945 | |
| BINARY | 10011000, 11111011, 11001011 | |
| iOS - SwiftUI | Color (red: 0.596, green: 0.984, blue: 0.796, alpha: 1) | |
| iOS - UIKit | UIColor (red: 0.596, green: 0.984, blue: 0.796, alpha: 1) | |
| Android - Compose | Color(0xFF98FBCB) |
