Cor nomeada · #007A64
Ultramarine Green
Ultramarine Green é #007A64: rgb(0 122 100), hsl(169 100% 24%), oklch(0.517 0.098 174.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Ultramarine Green color name →
#007A64
oklch(0.517 0.098 174.3)
Conversões de cor
- HEX
- #007a64
- RGB
- rgb(0 122 100)
- HSL
- hsl(169 100% 24%)
- HWB
- hwb(169 0% 52%)
- OKLCH
- oklch(0.517 0.098 174.3)
- OKLab
- oklab(0.517 -0.098 0.01)
- CIE Lab
- lab(45.25 -34.58 3.47)
- LCH
- lch(45.25 34.75 174.3)
- CMYK
- cmyk(100% 0% 18% 52%)
Tons claros · Sombras · Tons
Tons claros
- 318772
- 4C9481
- 64A190
- 7BAE9F
- 91BBAE
- A7C9BE
- BDD6CE
- D3E4DE
- E9F1EE
Sombras
- 006956
- 005948
- 00493B
- 003A2E
- 002B22
- 001D16
- 00100B
- 000503
- 000100
Tons
- 227B67
- 337C6A
- 407C6C
- 4B7D6F
- 557E72
- 5F7E75
- 677F78
- 707F7A
- 78807D
Harmonias de cor
Complementar +180°
- 007A64
Ultramarine Green
- 934F6C
≈ Goddess of Dawn
Análoga -30° +30°
- 007A64
Ultramarine Green
- 427743
≈ Autumn Crocodile
- 007680
≈ Hypnotic Sea
Tríade +120° +240°
- 007A64
Ultramarine Green
- 6C5C9B
≈ Just a Fairytale
- 93572C
≈ Sugar Almond
Complementar dividida +150° +210°
- 007A64
Ultramarine Green
- 845388
≈ Purple Fluorite
- 99504C
≈ Thy Flesh Consumed
Tétrade +90° +180° +270°
- 007A64
Ultramarine Green
- 4B66A1
≈ Starstruck
- 934F6C
≈ Goddess of Dawn
- 826315
≈ Rat Brown
Contraste e acessibilidade
Ag
AASobre branco
WCAG 5.29:1 · APCA Lc 76
Ag
FailSobre preto
WCAG 3.96:1 · APCA Lc 26
Melhor cor de texto: #FFFFFF
WCAG 5.29:1 (AA) · APCA Lc 76
Contrast pairs
Trechos de código
CSS
:root {
--ultramarine-green: #007a64;
--ultramarine-green-rgb: 0 122 100;
--ultramarine-green-oklch: oklch(0.517 0.098 174.3);
}
.element {
color: var(--ultramarine-green);
background-color: hsl(169 100% 24%);
border-color: oklch(0.517 0.098 174.3);
}Tailwind CSS v4
@theme {
--color-ultramarine-green: #007a64;
--color-ultramarine-green-50: #d9fff4;
--color-ultramarine-green-100: #c6f3e7;
--color-ultramarine-green-200: #a8e3d3;
--color-ultramarine-green-300: #7fc8b6;
--color-ultramarine-green-400: #58b19a;
--color-ultramarine-green-500: #259b81;
--color-ultramarine-green-600: #23836e;
--color-ultramarine-green-700: #1c6958;
--color-ultramarine-green-800: #144d3f;
--color-ultramarine-green-900: #0d362b;
--color-ultramarine-green-950: #012118;
}SCSS
$ultramarine-green: #007a64;
$ultramarine-green-rgb: 0, 122, 100;
$ultramarine-green-light: mix(#fff, $ultramarine-green, 20%);
$ultramarine-green-dark: mix(#000, $ultramarine-green, 20%);
.element {
color: $ultramarine-green;
box-shadow: 0 0 0 2px rgba($ultramarine-green, 0.35);
}