What is the hex code for Sky Cyan?

The hex code for Sky Cyan is #80DAEB.

What are the RGB values for Sky Cyan?

The RGB values for Sky Cyan are rgb(128, 218, 235).

Is Sky Cyan accessible on white backgrounds?

Sky Cyan has a contrast ratio of 1.60:1 on white, which does not pass WCAG AA (requires 4.5:1).

Sky Cyan (#80DAEB) — Hex, RGB, HSL & WCAG Scores

Tints & Shades

100

200

300

400

500

600

700

800

900

Scale from white (50) through Sky Cyan (500) to black (900), interpolated in Lab color space.

Color Values

HEX: #80DAEB
RGB: rgb(128, 218, 235)
HSL: hsl(190, 73%, 71%)
OKLCH: oklch(0.838 0.089 211)
CMYK: cmyk(46%, 7%, 0%, 8%)

Luminance:0.6073

CSS var:--color-sky-cyan

Tailwind:bg-[#80DAEB]

Accessibility

Score: 48/100

On White (#FFF)

1.6:1

Fail

On Black (#000)

13.15:1

AAA

On Light Gray (#F5F5F5)

1.47:1

Fail

Best text color on this background:

black — 13.15:1

Open in Contrast Checker →

Design Applications

Background

background-color: #80DAEB

Text Color

color: #80DAEB

bg-[#80DAEB] text-[#000000]

Accent border card component

border-left: 4px solid #80DAEB

Color Harmonies

Complementary

Tomato

#FF6347

Triadic

Byzantium

#702963

Army Green

#454B1B

Split-Complementary

Nadeshiko Pink

#F6ADC6

Old Lace

#FDF5E6

Analogous

Medium Aquamarine

#66CDAA

Tiffany Cyan

#81D8D0

Prussian Blue

#003153

Navy Blue

#001F5B

Similar Colors

Arctic Blue

#79D4DE

Non-Photo Blue

#A4DDED

Sky Blue

#87CEEB

Powder Blue

#B0E0E6

Baby Blue

#89CFF0

Light Blue

#ADD8E6

Color Meaning & Psychology

Cyan sits between blue and green at the edge of visible light and is the color the eye uses to adjust from warm to cool light. It feels technological, clean, and forward-thinking. In printing, cyan is a primary process color (CMYK), giving it an association with professional reproduction and precision. In design, bright cyan signals digital interfaces, clean tech, and innovation. Lighter cyans feel fresh and airy; deeper cyans approach teal's sophistication. Cyan's primary cultural associations are ocean, ice, and digital displays. It is widely used in healthcare technology brands because it combines blue's trust with green's health connotations without the blandness of either on their own. Its lighter value makes it approachable and soft — suitable for backgrounds, secondary UI states, and contexts requiring the hue's character without full intensity.

Industry Usage

Common contexts and industries where Sky Cyan is applied in professional design.

Digital technology and software products
Water sports and aquatic brands
Clean energy and sustainability companies
Healthcare data visualization tools
Modern media and streaming services
Virtual reality and immersive tech brands
Aerospace and precision technology
Clinical data and diagnostic imaging products

Accessibility Considerations

Normal Text

Fails AA

4.5:1 minimum required

Large Text

Fails AA Large

3:1 minimum required

UI Components

Check contrast

3:1 for non-text UI

Sky Cyan is a light color. Use black (#000000) text on top of it for maximum readability (13.15:1). Avoid white text on this background.

Test this color in the Contrast Checker →·WCAG Contrast Guide →

CSS & Code Examples

Background

background-color: #80DAEB;

Text

color: #80DAEB;

Border

border: 2px solid #80DAEB;

Box Shadow

box-shadow: 0 4px 20px #80DAEB40;

Gradient

background: linear-gradient(135deg, #80DAEB, #b4ffff);

Tailwind-style

--color-sky-cyan: #80DAEB;

Tailwind CSS Utilities

Use arbitrary value syntax in Tailwind CSS to apply Sky Cyan without a custom config.

Background

bg-[#80DAEB]

Text

text-[#80DAEB]

Border

border-[#80DAEB]

Ring

ring-[#80DAEB]

Fill

fill-[#80DAEB]

From (gradient)

from-[#80DAEB]

Via (gradient)

via-[#80DAEB]

To (gradient)

to-[#80DAEB]

Design Tokens

Ready-to-use Sky Cyan design token in CSS custom properties, SCSS, Tailwind v3/v4, and JSON formats.

CSS Custom Properties

:root {
  --color-sky-cyan: #80DAEB;
  --color-sky-cyan-rgb: 128, 218, 235;
  --color-sky-cyan-hsl: 190, 73%, 71%;
}

SCSS Variables

$color-sky-cyan: #80DAEB;
$color-sky-cyan-rgb: 128, 218, 235;
$color-sky-cyan-hsl: 190, 73%, 71%;

Tailwind v3 Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'sky-cyan': '#80DAEB',
      },
    },
  },
};

Tailwind v4 (@theme)

/* tailwind.css */
@theme {
  --color-sky-cyan: #80DAEB;
}

JSON Design Token (W3C format)

{
  "sky-cyan": {
    "value": "#80DAEB",
    "type": "color",
    "description": "Sky Cyan — #80DAEB"
  }
}

More cyan colors

View all →

Cyan

#00FFFF

Aqua

#00FFFF

Turquoise

#40E0D0

Aquamarine

#7FFFD4

Medium Turquoise

#48D1CC

Light Cyan

#E0FFFF

Dark Turquoise

#00CED1

Electric Cyan

#00FFFF

Robin Egg Blue

#00CCCC

Caribbean Blue

#1CA9C9

Pool Blue

#00B5CC

Bright Cyan

#00EDFF

What Does Sky Cyan Mean? Color Psychology & Cultural Symbolism

Color scientists note that cyan wavelengths are processed with exceptional acuity by the human visual system—a property that makes Sky Cyan (#80DAEB) particularly effective in digital environments. The psychological consequence is freshness: a sense of being precisely located and clearly seen.

Across color psychology research, cyan consistently tests high for "precision" associations, making Sky Cyan a reliable vehicle for freshness in cross-demographic audiences.
Brand designers draw on cyan-family tones to project modernity and innovation—values that Sky Cyan communicates in a light key.
At 73% saturation, Sky Cyan reads as moderately saturated—neither overwhelming nor passive, landing in the clarity, technology, freshness, and precision zone with measured confidence.
Sky Cyan's light lightness (71%) shifts its psychological register: Light cyan and aqua tones feel fresh and summery—associated with clear tropical water, sky, and a light coastal aesthetic.

Precision is Sky Cyan's promise. When that's what the design needs to communicate, nothing else does it better.

How to Use Sky Cyan in Design: Applications, Pairings & Best Practices

The design flexibility of Sky Cyan is notable: it works in both light and dark interfaces, both clinical and consumer contexts, and as both primary and accent color—a range that few other bright tones match.

Avoid: traditional or heritage brands, warm and artisanal contexts, and food packaging (no natural cyan foods).
Color harmonies: Sky Cyan's complementary color creates a high-energy split ideal for promotional design; its analogous palette (±30° hue) builds cohesive, monochromatic sophistication.
Proportional use: Sky Cyan's moderately saturated saturation (73%) means small applications—accents, highlights, icons—deliver maximum impact without visual fatigue. Reserve large-scale use for intentional brand moments.
Sky Cyan creates strong legibility with black text overlays (13.2:1 contrast ratio), making it a reliable background or surface color in design systems
Typography: Sky Cyan as text requires a dark background; its 71% lightness means it provides 1.6:1 contrast on white, not meeting WCAG AA.

Precision is Sky Cyan's promise. When that's what the design needs to communicate, nothing else does it better.

Sky Cyan Accessibility: WCAG Contrast Ratios, Color Blindness & Inclusive Design

Sky Cyan (#80DAEB) achieves a 13.15:1 contrast ratio with black text, surpassing the WCAG 2.1 AAA threshold of 7:1. This exceptional contrast qualifies it for body text, UI components at any size, and all accessibility-sensitive interface contexts. Relative luminance: 60.7%.

As text on white (#FFFFFF): 1.60:1 — Fail
As text on black (#000000): 13.15:1 — AAA ✓
Best text color on Sky Cyan background: Black (#000000) at 13.15:1
WCAG 2.1 luminance: 60.7% — above-median luminance—it reads as a light to mid-tone background, compatible with dark text while retaining color personality
Sky Cyan qualifies for all text sizes including small body copy (AAA).
Color blindness consideration: tritanopia (blue-yellow color blindness, ~0.003% of population) may affect how this color reads. While rare, for maximum accessibility supplement color signals with text or icon indicators in critical states.

Sky Cyan's WCAG profile makes it a compliant choice for most text applications.

Sky Cyan in Industry: Branding, Design & Market Applications

Sky Cyan (#80DAEB) is most at home in industries where clarity, technology, freshness, and precision are key brand values. Its light quality makes it particularly effective in Technology & Software contexts, where the moderately saturated saturation signals precision at exactly the right register.

Technology & Software: Cyan's additive light origins make it inherently digital—it's literally the color of screens. Tech brands use it to signal cutting-edge, screen-native products and the precision of digital systems. (examples: Apple, Microsoft, Salesforce) Works especially well in dark-mode interfaces where cyan provides high contrast and futuristic character.
Healthcare & Medical Imaging: Medical imaging technology (X-rays, ultrasounds, 3D scans) frequently uses cyan highlighting for precision and clarity. Healthcare tech brands have adopted this association to signal clinical precision in digital health products. (examples: CVS Health, Mayo Clinic, Kaiser Permanente) Pairs naturally with white and dark gray for a medical-precision aesthetic.
Clean Energy & Environment: Clean energy brands use cyan to signal the intersection of technology and environmental consciousness—the "clean" tech positioning that neither pure green (environmental emphasis) nor pure blue (tech emphasis) fully achieves alone. Cyan-to-green gradients have become a shorthand for clean tech and sustainable innovation.
Brand positioning: Sky Cyan is best suited for brands projecting precision, technology, clarity. Categories outside this positioning—traditional or heritage brands—tend to see weaker results.
Adjacent applications: Beyond primary industries, Sky Cyan works effectively in tech products, data dashboards, medical imaging—contexts where precision serves a secondary but reinforcing role.

The industries where Sky Cyan performs best are those where the audience expects precision. Build brand strategy around this alignment, not against it.

Accessibility & Design Guides

WCAG Contrast Ratio Guide

Understand contrast requirements for AA and AAA compliance

WCAG AA vs AAA

When to target AA vs AAA accessibility standards

Color Blindness Guide

Design for color vision deficiency with safe palettes

Accessible Design Systems

Build color systems that work for everyone

Frequently Asked Questions

What is the hex code for Sky Cyan?: The hex code for Sky Cyan is #80DAEB. Its RGB values are rgb(128, 218, 235) and its HSL values are hsl(190, 73%, 71%).
What does Sky Cyan mean in design?: Cyan sits between blue and green at the edge of visible light and is the color the eye uses to adjust from warm to cool light. It feels technological, clean, and forward-thinking. In printing, cyan is a primary process color (CMYK), giving it an association with professional reproduction and precision. In design, bright cyan signals digital interfaces, clean tech, and innovation. Lighter cyans feel fresh and airy; deeper cyans approach teal's sophistication. Cyan's primary cultural associations are ocean, ice, and digital displays. It is widely used in healthcare technology brands because it combines blue's trust with green's health connotations without the blandness of either on their own. Its lighter value makes it approachable and soft — suitable for backgrounds, secondary UI states, and contexts requiring the hue's character without full intensity.
Is Sky Cyan WCAG accessible?: Sky Cyan (#80DAEB) does not pass WCAG AA on white (1.6:1 ratio). Use it on dark backgrounds where it achieves 13.15:1. Its overall accessibility score is 48/100.
What colors go well with Sky Cyan?: Sky Cyan pairs well with its complementary color Tomato (#FF6347). Analogous colors like Medium Aquamarine and Tiffany Cyan also work harmoniously. Check the Color Harmonies section above for the full palette.
What is Sky Cyan used for?: Sky Cyan is commonly used for: Digital technology and software products; Water sports and aquatic brands; Clean energy and sustainability companies; Healthcare data visualization tools; Modern media and streaming services.
What are the CSS and Tailwind values for Sky Cyan?: In CSS, use `color: #80DAEB` or `background-color: #80DAEB`. The CSS custom property is `--color-sky-cyan: #80DAEB`. In Tailwind CSS, use the arbitrary value class `bg-[#80DAEB]` for backgrounds or `text-[#80DAEB]` for text.