Copacabana

#006c8d

Teal-leaning blue for tighter, cleaner UI contrast

Save
Share

About Copacabana

Copacabana is the blue that lands between 's austere coolness and 's teal-leaning warmth. It's saturated enough to hold weight without feeling clinical, pure enough to read as genuine blue instead of a compromised teal. You notice it doesn't soften itself the way does, but it also doesn't demand the isolation that needs.

Reach for this one in healthcare platforms, fintech dashboards, and SaaS product interfaces where you need active states and primary buttons that feel authoritative but not cold. It punches on light backgrounds and holds itself in dense layouts without disappearing. Pairs cleanly with white type and sits naturally next to lighter neutrals, less fussy about context than its cooler neighbors.

The difference: Copacabana splits the gap between pure cool and teal-warm with no compromise in either direction. It's the one you reach for when feels too rigid and feels too friendly. Test it early, but it typically needs less handholding in layouts than the deeper, cooler options.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
5.95:1AAAAA Large

On Gray 100 #f5f5f5

Aa
5.46:1AAAAA Large

On Gray 900 #18181b

Aa
2.98:1Fail

On Black #000000

Aa
3.53:1FailAA Large

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Copacabana

Open the generator with this color pre-loaded.

Start creating