Mosque

#005f5b

Deep blue-teal for decisive, higher-contrast UI accents

Save
Share

About Mosque

Mosque reads like a deep, serviceable teal you'd pick without thinking, like ink after it settles into paper fibers. It's not the greener, richer push of , and it's not the medium, calmer in-between that gives you. Compared to , Mosque stays cooler and tighter, with less of that muted, contemplative softness.

Use it when you need blue family confidence in places that can't look "almost right." It's a strong fit for dashboards and finance apps where headers, section bars, and card outlines need to feel solid, not subdued. I also like it for healthcare UI panels and workflow states when you want the primary emphasis to be steady, especially over clean neutrals.

One quirk: it can look slightly more saturated next to warm grays, so if your UI uses lots of beige or sand tones, test the balance early. Pairing it with crisp whites keeps it from turning flat.

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
7.53:1AAA

On Gray 100 #f5f5f5

Aa
6.91:1AAAAA Large

On Gray 900 #18181b

Aa
2.35:1Fail

On Black #000000

Aa
2.79:1Fail

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 Mosque

Open the generator with this color pre-loaded.

Start creating