Cor nomeada · #DDB8A3
Coral Bay
Coral Bay é #DDB8A3: rgb(221 184 163), hsl(22 46% 75%), oklch(0.81 0.052 51.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Coral Bay color name →
#DDB8A3
oklch(0.81 0.052 51.3)
Conversões de cor
- HEX
- #ddb8a3
- RGB
- rgb(221 184 163)
- HSL
- hsl(22 46% 75%)
- HWB
- hwb(22 64% 13%)
- OKLCH
- oklch(0.81 0.052 51.3)
- OKLab
- oklab(0.81 0.032 0.04)
- CIE Lab
- lab(77.68 11.45 15.95)
- LCH
- lch(77.68 19.63 54.3)
- CMYK
- cmyk(0% 17% 26% 13%)
Tons claros · Sombras · Tons
Tons claros
- E1BFAC
- E4C6B5
- E8CDBE
- EBD4C7
- EEDBD0
- F2E2DA
- F5E9E3
- F8F1EC
- FCF8F6
Sombras
- C0A08D
- A48878
- 887163
- 6E5B4F
- 55453C
- 3D312A
- 261E19
- 110C0A
- 020201
Tons
- D3B2A0
- CAAD9C
- C0A799
- B7A195
- AE9C92
- A4968E
- 9B918B
- 928B87
- 898684
Harmonias de cor
Complementar +180°
- DDB8A3
Coral Bay
- A0C7DD
≈ Piezo Blue
Análoga -30° +30°
- DDB8A3
Coral Bay
- E1B4B2
≈ Princess Pink
- D2BE9B
≈ Eire
Tríade +120° +240°
- DDB8A3
Coral Bay
- A0CCBC
≈ Tareyton
- C0BBE0
≈ Melrose
Complementar dividida +150° +210°
- DDB8A3
Coral Bay
- 9ACBCF
≈ Pentagon
- AEC2E3
≈ Promise
Tétrade +90° +180° +270°
- DDB8A3
Coral Bay
- AFCAAB
≈ Relish
- A0C7DD
≈ Piezo Blue
- D1B6D5
≈ Lilac Haze
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.83:1 · APCA Lc 34
Ag
AAASobre preto
WCAG 11.45:1 · APCA Lc 68
Melhor cor de texto: #000000
WCAG 11.45:1 (AAA) · APCA Lc 68
Contrast pairs
Trechos de código
CSS
:root {
--coral-bay: #ddb8a3;
--coral-bay-rgb: 221 184 163;
--coral-bay-oklch: oklch(0.81 0.052 51.3);
}
.element {
color: var(--coral-bay);
background-color: hsl(22 46% 75%);
border-color: oklch(0.81 0.052 51.3);
}Tailwind CSS v4
@theme {
--color-coral-bay: #ddb8a3;
--color-coral-bay-50: #fff2e8;
--color-coral-bay-100: #f7e4d8;
--color-coral-bay-200: #e7cfc0;
--color-coral-bay-300: #ceb19f;
--color-coral-bay-400: #b89683;
--color-coral-bay-500: #a37d67;
--color-coral-bay-600: #896a57;
--color-coral-bay-700: #6e5446;
--color-coral-bay-800: #513d33;
--color-coral-bay-900: #392a22;
--color-coral-bay-950: #231811;
}SCSS
$coral-bay: #ddb8a3;
$coral-bay-rgb: 221, 184, 163;
$coral-bay-light: mix(#fff, $coral-bay, 20%);
$coral-bay-dark: mix(#000, $coral-bay, 20%);
.element {
color: $coral-bay;
box-shadow: 0 0 0 2px rgba($coral-bay, 0.35);
}