Najbliższy nazwany kolor · #D36D86
#D36D86
Najbliższy nazwany kolor: Strawberry Milkshake
#D36D86 (rgb(211 109 134), hsl(345 54% 63%), oklch(0.659 0.13 5.7)) jest najbliższy nazwanemu kolorowi Strawberry Milkshake. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#D36D86
oklch(0.659 0.13 5.7)
Konwersje koloru
- HEX
- #d36d86
- RGB
- rgb(211 109 134)
- HSL
- hsl(345 54% 63%)
- HWB
- hwb(345 43% 17%)
- OKLCH
- oklch(0.659 0.13 5.7)
- OKLab
- oklab(0.659 0.13 0.013)
- CIE Lab
- lab(58.88 42.86 5.63)
- LCH
- lch(58.88 43.22 7.5)
- CMYK
- cmyk(0% 48% 36% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D97C91
- DE8B9D
- E499A9
- E9A8B5
- EDB6C1
- F1C5CD
- F5D3D9
- F9E2E6
- FCF0F2
Odcienie ciemniejsze
- B75E74
- 9C4F62
- 824151
- 693340
- 512630
- 3A1921
- 240D13
- 100406
- 020101
Tony
- CB7085
- C47285
- BC7584
- B47784
- AC7983
- A37A82
- 9B7C82
- 927E81
- 897F81
Harmonie kolorów
Komplementarna +180°
- D36D86
Strawberry Milkshake
- 00A89C
≈ Tropical Hideaway
Analogowa -30° +30°
- D36D86
Strawberry Milkshake
- C371B0
≈ Bishop Red
- D57258
≈ OK Corral
Triada +120° +240°
- D36D86
Strawberry Milkshake
- 7EA03F
≈ New Shoot
- 4398DC
≈ Flax Flower Blue
Komplementarna rozszczepiona +150° +210°
- D36D86
Strawberry Milkshake
- 40A96F
≈ Beanstalk
- 00A3BF
≈ January Blue
Tetrada +90° +180° +270°
- D36D86
Strawberry Milkshake
- AA9016
≈ Bark Sawdust
- 00A89C
≈ Tropical Hideaway
- 7C8AE1
≈ Tanzine
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.33:1 · APCA Lc 60
Ag
AANa czerni
WCAG 6.30:1 · APCA Lc 41
Najlepszy kolor tekstu: #000000
WCAG 6.30:1 (AA) · APCA Lc 41
Contrast pairs
Fragmenty kodu
CSS
:root {
--strawberry-milkshake: #d36d86;
--strawberry-milkshake-rgb: 211 109 134;
--strawberry-milkshake-oklch: oklch(0.659 0.13 5.7);
}
.element {
color: var(--strawberry-milkshake);
background-color: hsl(345 54% 63%);
border-color: oklch(0.659 0.13 5.7);
}Tailwind CSS v4
@theme {
--color-strawberry-milkshake: #d36d86;
--color-strawberry-milkshake-50: #ffe6ee;
--color-strawberry-milkshake-100: #ffd7e0;
--color-strawberry-milkshake-200: #ffbeca;
--color-strawberry-milkshake-300: #f19bab;
--color-strawberry-milkshake-400: #de7c93;
--color-strawberry-milkshake-500: #cb5c79;
--color-strawberry-milkshake-600: #ac4f67;
--color-strawberry-milkshake-700: #8a3f52;
--color-strawberry-milkshake-800: #662d3d;
--color-strawberry-milkshake-900: #481e2a;
--color-strawberry-milkshake-950: #2f0e18;
}SCSS
$strawberry-milkshake: #d36d86;
$strawberry-milkshake-rgb: 211, 109, 134;
$strawberry-milkshake-light: mix(#fff, $strawberry-milkshake, 20%);
$strawberry-milkshake-dark: mix(#000, $strawberry-milkshake, 20%);
.element {
color: $strawberry-milkshake;
box-shadow: 0 0 0 2px rgba($strawberry-milkshake, 0.35);
}