Nazwany kolor · #9A382D
Ketchup
Ketchup to #9A382D: rgb(154 56 45), hsl(6 55% 39%), oklch(0.478 0.133 29.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Ketchup color name →
#9A382D
oklch(0.478 0.133 29.3)
Konwersje koloru
- HEX
- #9a382d
- RGB
- rgb(154 56 45)
- HSL
- hsl(6 55% 39%)
- HWB
- hwb(6 18% 40%)
- OKLCH
- oklch(0.478 0.133 29.3)
- OKLab
- oklab(0.478 0.116 0.065)
- CIE Lab
- lab(38.17 41.2 29.37)
- LCH
- lch(38.17 50.59 35.5)
- CMYK
- cmyk(0% 64% 71% 40%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A64D41
- B16155
- BC7469
- C7887E
- D19B92
- DBAFA7
- E5C2BD
- EED6D2
- F7EBE9
Odcienie ciemniejsze
- 852F26
- 71271F
- 5E1F18
- 4B1711
- 390F0B
- 270806
- 170402
- 090101
- 010000
Tony
- 994136
- 97493F
- 965147
- 945850
- 916058
- 8F6660
- 8C6D68
- 887370
- 847A78
Harmonie kolorów
Komplementarna +180°
- 9A382D
Ketchup
- 006976
≈ Cotton Indigo
Analogowa -30° +30°
- 9A382D
Ketchup
- 95355B
≈ Forward Fuchsia
- 8A4A00
≈ Brown Eyed Girl
Triada +120° +240°
- 9A382D
Ketchup
- 01712F
≈ Bogey Green
- 3F56A7
≈ Blasphemous Blue
Komplementarna rozszczepiona +150° +210°
- 9A382D
Ketchup
- 006D5E
≈ Forest Splendour
- 006493
≈ Bauhaus Blue
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
AAANa bieli
WCAG 7.05:1 · APCA Lc 84
Ag
FailNa czerni
WCAG 2.97:1 · APCA Lc 18
Najlepszy kolor tekstu: #FFFFFF
WCAG 7.05:1 (AAA) · APCA Lc 84
Contrast pairs
Fragmenty kodu
CSS
:root {
--ketchup: #9a382d;
--ketchup-rgb: 154 56 45;
--ketchup-oklch: oklch(0.478 0.133 29.3);
}
.element {
color: var(--ketchup);
background-color: hsl(6 55% 39%);
border-color: oklch(0.478 0.133 29.3);
}Tailwind CSS v4
@theme {
--color-ketchup: #9a382d;
--color-ketchup-50: #ffe8de;
--color-ketchup-100: #ffd8cd;
--color-ketchup-200: #ffc0b1;
--color-ketchup-300: #f49d8d;
--color-ketchup-400: #e27e6f;
--color-ketchup-500: #d05e50;
--color-ketchup-600: #af5044;
--color-ketchup-700: #8d4036;
--color-ketchup-800: #692d28;
--color-ketchup-900: #4a1f1b;
--color-ketchup-950: #300e0b;
}SCSS
$ketchup: #9a382d;
$ketchup-rgb: 154, 56, 45;
$ketchup-light: mix(#fff, $ketchup, 20%);
$ketchup-dark: mix(#000, $ketchup, 20%);
.element {
color: $ketchup;
box-shadow: 0 0 0 2px rgba($ketchup, 0.35);
}