What are the hex codes in the Ocean & Cyan Hour palette?

The Ocean & Cyan Hour color palette consists of Taupe #474500, Ocean #0077B6, Cyan #00B4D8, Powder Blue #90E0EF.

How should I use the Ocean & Cyan Hour palette on a website?

Use Powder Blue #90E0EF as the background, Taupe #474500 for text, Ocean #0077B6 for buttons and links, and Cyan #00B4D8 for accents. 1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Taupe on Powder Blue at 6.65:1.

Which colors in Ocean & Cyan Hour have enough contrast for text?

The highest-contrast pair is #474500 on #90E0EF with a ratio of 6.65:1, which passes WCAG AA for normal text.

#474500Taupe

#0077B6Ocean

#00B4D8Cyan

#90E0EFPowder Blue

Ocean & Cyan Hour color palette

Modern Blue Teal

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Taupe	`#474500`	`rgb(71, 69, 0)`	`hsl(58, 100%, 14%)`	`oklch(38.0% 0.082 108)`
Ocean	`#0077B6`	`rgb(0, 119, 182)`	`hsl(201, 100%, 36%)`	`oklch(54.6% 0.131 243)`
Cyan	`#00B4D8`	`rgb(0, 180, 216)`	`hsl(190, 100%, 42%)`	`oklch(71.1% 0.129 219)`
Powder Blue	`#90E0EF`	`rgb(144, 224, 239)`	`hsl(189, 75%, 75%)`	`oklch(86.0% 0.081 211)`

Why it works and how to use it

Ocean & Cyan Hour is a vivid complementary color palette tagged modern, blue, teal. Near-complementary hues (about 143° apart) make this a high-contrast, attention-grabbing combination. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Ocean takes the lead while the rest support. Lightness runs from 14% to 75%. Well suited to websites, presentations and branding.

Background: Powder Blue (#90E0EF) is the lightest color, so it belongs on large surfaces.
Text: Taupe (#474500) on #90E0EF gives 6.65:1, passing WCAG AA.
Primary: Ocean (#0077B6) is the most saturated mid-tone; use it for buttons and links (3.27:1 against the background, fine for UI elements).
Accent: Cyan (#00B4D8) for highlights, badges and hover states.

1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Taupe on Powder Blue at 6.65:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Ocean & Cyan Hour

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#474500

#0077B6

#00B4D8

#90E0EF

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#474500` on `#90E0EF`	Aa	6.65:1	AA
`#474500` on `#00B4D8`	Aa	4.02:1	AA large only
`#0077B6` on `#90E0EF`	Aa	3.27:1	AA large only
`#474500` on `#0077B6`	Aa	2.04:1	Fail
`#0077B6` on `#00B4D8`	Aa	1.97:1	Fail
`#00B4D8` on `#90E0EF`	Aa	1.65:1	Fail

Similar palettes 24 more in this mood