Very Light Azure
HEX: #74BBFB | Modern Palette
On White
2.05:1
FAIL
On Black
10.24:1
PASS
Color Specifications
HEX
#74BBFB
RGB
116, 187, 251
HSL
208°, 53% ,98%
CMYK
53.78, 25.5, 0, 1.57
About Very Light Azure
Very Light Azure (#74BBFB) is a color with RGB(116, 187, 251) and HSL(208.44°, 53.78%, 98.43%). In design, it fits Cool styles and is suitable for Text, Button, Background. Its complementary color is #FBB474, which creates strong contrast. Its triadic palette includes #FB74BB and #BBFB74.
- HEX: #74BBFB
- RGB: 116, 187, 251
- HSL: 208.44°, 53.78%, 98.43%
- Style: Cool
- Use case: Text, Button, Background
- Complementary color: #FBB474
- Triadic colors: #FB74BB, #BBFB74
Live Components
LIGHT
DARK
System Notification Box
Color Palettes
Very Light Azure #74BBFB is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.
Monochromatic
Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent
Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous
Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1
Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.
Color Harmonies
Very Light Azure #74BBFB pairs with #FBB474 as its complementary color, and #FB74BB and #BBFB74 in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.
Color Characteristics
Accessibility Simulation
Deuteranopia
#AAAAFC
Protanopia
#B5B5FB
Tritanopia
#5EC5C5
Achromatopsia
#B5B5B5
Frequently Asked Questions
Very Light Azure (#74BBFB) is a color with RGB(116, 187, 251) and HSL(208.44°, 53.78%, 98.43%).
#74BBFB pairs strongly with #FBB474 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.
#74BBFB is suitable for Text, Button, Background and works well with Cool styles.
Code Snippets
/* Background */
.element {
background-color: #74BBFB;
}
/* Text */
.element {
color: #74BBFB;
}
/* Border */
.element {
border: 1px solid #74BBFB;
}/* Linear gradient to complementary */
.element {
background: linear-gradient(
to right,
#74BBFB,
#FDFBF9
);
}
/* Radial gradient */
.element {
background: radial-gradient(
circle,
#74BBFB,
#FDFBF9
);
}// SCSS variable
$very-light-azure: #74BBFB;
// With RGB channels (useful for rgba() usage)
$very-light-azure-r: 116;
$very-light-azure-g: 187;
$very-light-azure-b: 251;
// Usage
.element {
background-color: $very-light-azure;
color: rgba($very-light-azure-r, $very-light-azure-g, $very-light-azure-b, 0.8);
}