Dark Cyan
HEX: #008B8B | Modern Palette
Color Specifications
#008B8B
0, 139, 139
180°, 100% ,54%
100, 0, 0, 45.49
About Dark Cyan
Dark Cyan (#008B8B) is a color with RGB(0, 139, 139) and HSL(180°, 100%, 54.51%). It is commonly associated with Bold moods. In design, it fits Vivid, Cool styles and is suitable for Text, Button, Accent. Its complementary color is Dark Red (#8B0000), which creates strong contrast. Its triadic palette includes Dark Magenta (#8B008B) and #8B8B00.
- HEX: #008B8B
- RGB: 0, 139, 139
- HSL: 180°, 100%, 54.51%
- Mood: Bold
- Style: Vivid, Cool
- Use case: Text, Button, Accent
- Complementary color: Dark Red (#8B0000)
- Triadic colors: Dark Magenta (#8B008B), #8B8B00
Live Components
Color Palettes
Dark Cyan #008B8B is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.
Color Harmonies
Dark Cyan #008B8B pairs with Dark Red (#8B0000) as its complementary color, and Dark Magenta (#8B008B) and #8B8B00 in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.
Complementary
The color directly opposite on the color wheel — creates maximum contrast and vibrance.
Triadic
Three colors equally spaced 120° apart — bold, balanced, and visually rich.
Tetradic (Square)
Four colors at 90° intervals — rich variety, best when one color dominates.
Shades & Tints
The shade and tint range for Dark Cyan #008B8B moves from dark #001A1A tones through the base color to lighter #E6FFFF tones, making it useful for depth, hierarchy, and background variation.
Frequently Asked Questions
Code Snippets
/* Background */
.element {
background-color: #008B8B;
}
/* Text */
.element {
color: #008B8B;
}
/* Border */
.element {
border: 1px solid #008B8B;
}
/* Linear gradient to complementary */
.element {
background: linear-gradient(
to right,
#008B8B,
#FF1717
);
}
/* Radial gradient */
.element {
background: radial-gradient(
circle,
#008B8B,
#FF1717
);
}
// SCSS variable
$dark-cyan: #008B8B;
// With RGB channels (useful for rgba() usage)
$dark-cyan-r: 0;
$dark-cyan-g: 139;
$dark-cyan-b: 139;
// Usage
.element {
background-color: $dark-cyan;
color: rgba($dark-cyan-r, $dark-cyan-g, $dark-cyan-b, 0.8);
}