Nazwany kolor · #9C2E33
Ruby Slippers
Ruby Slippers to #9C2E33: rgb(156 46 51), hsl(357 54% 40%), oklch(0.47 0.145 22.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Ruby Slippers color name →
#9C2E33
oklch(0.47 0.145 22.3)
Konwersje koloru
- HEX
- #9c2e33
- RGB
- rgb(156 46 51)
- HSL
- hsl(357 54% 40%)
- HWB
- hwb(357 18% 39%)
- OKLCH
- oklch(0.47 0.145 22.3)
- OKLab
- oklab(0.47 0.134 0.055)
- CIE Lab
- lab(37.03 46.29 24.51)
- LCH
- lch(37.03 52.38 27.9)
- CMYK
- cmyk(0% 71% 67% 39%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A84546
- B45A59
- BF6F6C
- C98380
- D39894
- DDACA9
- E6C0BE
- EFD5D3
- F7EAE9
Odcienie ciemniejsze
- 87272B
- 731F23
- 5F181C
- 4C1214
- 390B0D
- 280607
- 180203
- 090101
- 010000
Tony
- 9B393B
- 994343
- 974C4B
- 955452
- 935C5A
- 906461
- 8D6B69
- 897271
- 857978
Harmonie kolorów
Komplementarna +180°
- 9C2E33
Ruby Slippers
- 00686E
≈ Tahitian Treat
Analogowa -30° +30°
- 9C2E33
Ruby Slippers
- 942F63
≈ Magenta Manicure
- 8D4300
≈ Otterly Brown
Triada +120° +240°
- 9C2E33
Ruby Slippers
- 186E14
≈ Bogey Green
- 2B56AB
≈ Blasphemous Blue
Komplementarna rozszczepiona +150° +210°
- 9C2E33
Ruby Slippers
- 006B55
≈ Poster Green
- 006387
≈ Blue Heist
Tetrada +90° +180° +270°
- 9C2E33
Ruby Slippers
- 5C6000
≈ Kirchner Green
- 00686E
≈ Tahitian Treat
- 5F46A4
≈ Ultrapurple Merge
Kontrast i dostępność
Ag
AAANa bieli
WCAG 7.36:1 · APCA Lc 85
Ag
FailNa czerni
WCAG 2.85:1 · APCA Lc 17
Najlepszy kolor tekstu: #FFFFFF
WCAG 7.36:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmenty kodu
CSS
:root {
--ruby-slippers: #9c2e33;
--ruby-slippers-rgb: 156 46 51;
--ruby-slippers-oklch: oklch(0.47 0.145 22.3);
}
.element {
color: var(--ruby-slippers);
background-color: hsl(357 54% 40%);
border-color: oklch(0.47 0.145 22.3);
}Tailwind CSS v4
@theme {
--color-ruby-slippers: #9c2e33;
--color-ruby-slippers-50: #ffe6e1;
--color-ruby-slippers-100: #ffd6d0;
--color-ruby-slippers-200: #ffbcb6;
--color-ruby-slippers-300: #f99993;
--color-ruby-slippers-400: #e87876;
--color-ruby-slippers-500: #d55758;
--color-ruby-slippers-600: #b44a4b;
--color-ruby-slippers-700: #913b3c;
--color-ruby-slippers-800: #6c2a2c;
--color-ruby-slippers-900: #4c1c1e;
--color-ruby-slippers-950: #320c0e;
}SCSS
$ruby-slippers: #9c2e33;
$ruby-slippers-rgb: 156, 46, 51;
$ruby-slippers-light: mix(#fff, $ruby-slippers, 20%);
$ruby-slippers-dark: mix(#000, $ruby-slippers, 20%);
.element {
color: $ruby-slippers;
box-shadow: 0 0 0 2px rgba($ruby-slippers, 0.35);
}