Cyan

#00FFFF

What color is Cyan?

Cyan is a bright blue-green that appears cool and clear, hex #00FFFF, similar in tone to shallow tropical seawater. It is lighter than teal and more vivid than aquamarine, with a strong blue pull that keeps it from reading as green.

What is the meaning of the color Cyan?

Named from the Greek kyanos, meaning dark blue, the word entered English color use by the mid-19th century alongside advances in printing and dye chemistry. Cyan became one of the four standard ink colors in the CMYK printing model developed and formalized through the 20th century, where it serves as the blue-green primary used to reproduce a broad range of cool tones. Its role was standardized through commercial print production, and it anchors the ink cartridge system sold by companies such as Epson and Canon to this day.

RGB
0, 255, 255
HSL
180°, 100%, 50%
CMYK
100, 0, 0, 0
HSV
180°, 100%, 100%
Cyan color

What colors go with Cyan?

Colors that pair well with Cyan include:
White: clean, open contrast
Navy: deep, grounding balance
Coral: warm, vivid complement
Gray: soft, neutral backdrop
Black: bold, sharp definition

Similar Colors

Conversions & Codes

Format Value CSS
HEX #00FFFF color: #00FFFF;
RGB 0, 255, 255 color: rgb(0, 255, 255);
RGB Percentage 0%, 100%, 100% color: rgb(0%, 100%, 100%);
CMYK 100%, 0%, 0%, 0% Not supported in CSS
HSL 180°, 100%, 50% color: hsl(180, 100%, 50%);
HSV 180°, 100%, 100% Not supported in CSS
CIE-LAB 40, -51, 0 color: lab(40% -51 0);
Decimal 65535 Not supported in CSS

Color Variations

Shades

#00FFFF
#00E6E6
#00CCCC
#00B3B3
#009999
#008080
#006666
#004D4D

Tints

#B3FFFF
#99FFFF
#80FFFF
#66FFFF
#4DFFFF
#33FFFF
#1AFFFF
#00FFFF

Tones

#00FFFF
#0DF2F2
#1AE6E6
#26D9D9
#33CCCC
#40BFBF
#4DB3B3
#59A6A6

Hues

#00FFFF
#0040FF
#8000FF
#FF00BF
#FF0000
#FFBF00
#80FF00
#00FF40

Color Harmonies

Analogous

#00FF80
Click to copy
#00FFFF
Click to copy
100%
#0080FF
Click to copy
100%

Complementary

#00FFFF
Click to copy
100%
#FF0000
Click to copy
98%

Split Complementary

#00FFFF
Click to copy
100%
#FF0080
Click to copy
98%
#FF8000
Click to copy

Triadic

#00FFFF
Click to copy
100%
#FF00FF
Click to copy
#FFFF00
Click to copy

Tetradic

#00FFFF
Click to copy
100%
#8000FF
Click to copy
#FF0000
Click to copy
98%
#80FF00
Click to copy

Square

#00FFFF
Click to copy
100%
#8000FF
Click to copy
#FF0000
Click to copy
98%
#80FF00
Click to copy

CSS & Dev Snippets

CSS
.cyan {
  color: #00FFFF;
}
SCSS
$cyan: #00FFFF;
RGB
rgb(0, 255, 255)

Accessibility & Contrast

White background

1.25:1
1.25
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

16.75:1
16.75
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags