#6CEABE

Accessibility

AAA

14.15:1

Vs white / black

1.48:1 · 14.15:1

Sources

Library color

Codes

Formats

HEX

#6ceabe

RGB

rgb(108, 234, 190)

RGBA

rgba(108, 234, 190, 1)

HSL

hsl(159, 75%, 67%)

HSLA

hsla(159, 75%, 67%, 1)

HSV

hsv(159, 54%, 92%)

LAB

lab(84.87% -45.37 10.83)

LCH

lch(84.87% 46.64 166.57)

OKLAB

oklab(0.8534 -0.1269 0.0278)

OKLCH

oklch(0.8534 0.1299 167.64)

XYZ

xyz(44.90, 65.75, 59.03)

CMYK

cmyk(54%, 0%, 19%, 8%)

CSS

color: #6ceabe;

CSS variable

--color-6ceabe: #6ceabe;

SCSS

$color-6ceabe: #6ceabe;

JavaScript

const color = "#6ceabe";

TypeScript

const color: string = "#6ceabe";

React

style={{ backgroundColor: "#6ceabe" }}

JSON

{ "hex": "#6ceabe", "rgb": { "r": 108, "g": 234, "b": 190 }, "oklch": "oklch(0.8534 0.1299 167.64)" }

Export

Developer code

css

:root {
  --#6ceabe-1: #6ceabe;
}

Design systems

Nearest official tokens

An arbitrary HEX is not an official Tailwind, Material, or Bootstrap color. Distance is CIEDE2000.

Nearest Tailwind color

emerald-300

Similar · ΔE 1.41 · #6EE7B7

Nearest CSS named color

Aquamarine

Noticeably different · ΔE 4.59 · #7FFFD4

Nearest Material color

green-200

Very different · ΔE 10.48 · #A5D6A7

Nearest Bootstrap color

light

Very different · ΔE 25.94 · #F8F9FA

OKLCH

Perceptual 50–950 scale

Generated in OKLCH from this hex. Not an official Tailwind scale unless the hex itself is a Tailwind token.

50c1ffeb 100affbdd 2008feac7 3006ad6af 40034bb91 500009e76 600008563 700006b4e 80000523a 900003a28 950002314

Palette

Tints & shades

Full scale from light tints through the base color into deep shades

f3fdfa e7fcf4 dafaef cef8e9 c2f6e4 b6f5df a9f3d9 9df1d4 91efce 85eec9 78ecc3 6ceabe 63d7ae 5ac39e 51b08f 489c7f 3f886f 36755f 2d614f 244e3f 1b3b30 122720 091410

Palette

Tints

Mixed toward white — soft backgrounds and highlights

f3fdfa e7fcf4 dafaef cef8e9 c2f6e4 b6f5df a9f3d9 9df1d4 91efce 85eec9 78ecc3

Palette

Shades

Mixed toward black — depth, text, and emphasis

63d7ae 5ac39e 51b08f 489c7f 3f886f 36755f 2d614f 244e3f 1b3b30 122720 091410

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

6ee1b9 6fd8b4 71d0af 73c7a9 74bea4 76b59f 78ac9a 79a395 7b9b90 7d928a 7e8985

Harmony

Complementary

Opposite on the color wheel for contrast

#6CEABEStop 1 #EA6C98Stop 2

Harmony

Analogous

Neighbors that sit comfortably together

#6CEA7FStop 1 #6CEABEStop 2 #6CD7EAStop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#6CEABEStop 1 #BE6CEAStop 2 #EABE6CStop 3

Harmony

Split complementary

Base plus two accents beside the complement

#6CEABEStop 1 #EA6CD7Stop 2 #EA7F6CStop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#0D593EStop 1 #169C6DStop 2 #20DF9CStop 3 #63E9BAStop 4 #A6F2D7Stop 5

Using this color

Where #6ceabe works

#6CEABE (#6ceabe) sits in the teal family at about 159° hue, 75% saturation, and 67% lightness. Contrast is 1.48:1 on white and 14.15:1 on black, so near-black labels read more clearly on the swatch itself. Nearest Tailwind token: emerald-300 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

supporting UI accents
text or icons on charcoal / dark mode

Do not use #6ceabe as small body text on white — 1.48:1 misses WCAG AA (4.5:1). Pair it with a darker shade from the scale below, or check pairs in the contrast checker.

Family context: Balance, healing, and sophistication. Popular in wellness and modern dashboards. Common uses still include buttons, charts, and accents in the Teal range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Tailwind emerald 300#6EE7B7 Spectrum #75F0C9#75F0C9 Spectrum #75E6B5#75E6B5 Light Greenish Blue#55EFC4 Spectrum #52EBB8#52EBB8 Spectrum #75E1BB#75E1BB Spectrum #56E6C0#56E6C0 Spectrum #70F5C0#70F5C0 Spectrum #74ECCE#74ECCE Spectrum #35DEAE#35DEAE Spectrum #70EBAD#70EBAD Spectrum #5AD8AA#5AD8AA