Named color · #DD675A
Coralite
Coralite is #DD675A: rgb(221 103 90), hsl(6 66% 61%), oklch(0.654 0.15 28.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Coralite color name →
#DD675A
oklch(0.654 0.15 28.3)
Color conversions
- HEX
- #dd675a
- RGB
- rgb(221 103 90)
- HSL
- hsl(6 66% 61%)
- HWB
- hwb(6 35% 13%)
- OKLCH
- oklch(0.654 0.15 28.3)
- OKLab
- oklab(0.654 0.132 0.071)
- CIE Lab
- lab(58.44 46.39 30.63)
- LCH
- lch(58.44 55.59 33.4)
- CMYK
- cmyk(0% 53% 59% 13%)
Tints · Shades · Tones
Tints
- E2776A
- E7877A
- EC968B
- F0A59B
- F3B4AB
- F7C3BC
- FAD2CC
- FCE1DD
- FEF0EE
Shades
- C0594D
- A44B41
- 883D35
- 6E3029
- 55231E
- 3D1713
- 260C09
- 110403
- 020000
Tones
- D46B5E
- CC6E63
- C37167
- BA746B
- B1776F
- A87972
- 9F7B76
- 957D79
- 8B7F7D
Color harmonies
Complementary +180°
- DD675A
Coralite
- 00A3B4
≈ Garish Blue
Analogous -30° +30°
- DD675A
Coralite
- D7648F
≈ Preppy Rose
- D27514
≈ Ochre
Triadic +120° +240°
- DD675A
Coralite
- 41A959
≈ Devil’s Grass
- 6A8AEC
≈ Soft Blue
Split-complementary +150° +210°
- DD675A
Coralite
- 00A891
≈ Shindig
- 009BDE
≈ Atmosphere
Tetradic +90° +180° +270°
- DD675A
Coralite
- 889C09
≈ BioShock
- 00A3B4
≈ Garish Blue
- 9D79DF
≈ Matt Purple
Contrast & accessibility
Ag
FailOn white
WCAG 3.40:1 · APCA Lc 61
Ag
AAOn black
WCAG 6.16:1 · APCA Lc 41
Best text color: #000000
WCAG 6.16:1 (AA) · APCA Lc 41
Contrast pairs
Code snippets
CSS
:root {
--coralite: #dd675a;
--coralite-rgb: 221 103 90;
--coralite-oklch: oklch(0.654 0.15 28.3);
}
.element {
color: var(--coralite);
background-color: hsl(6 66% 61%);
border-color: oklch(0.654 0.15 28.3);
}Tailwind CSS v4
@theme {
--color-coralite: #dd675a;
--color-coralite-50: #ffe6dc;
--color-coralite-100: #ffd6ca;
--color-coralite-200: #ffbcae;
--color-coralite-300: #fb9989;
--color-coralite-400: #ea786b;
--color-coralite-500: #d8564a;
--color-coralite-600: #b64a3f;
--color-coralite-700: #923b32;
--color-coralite-800: #6d2925;
--color-coralite-900: #4d1c19;
--color-coralite-950: #330b0a;
}SCSS
$coralite: #dd675a;
$coralite-rgb: 221, 103, 90;
$coralite-light: mix(#fff, $coralite, 20%);
$coralite-dark: mix(#000, $coralite, 20%);
.element {
color: $coralite;
box-shadow: 0 0 0 2px rgba($coralite, 0.35);
}