Nazwany kolor · #C15154
Basashi Red
Basashi Red to #C15154: rgb(193 81 84), hsl(358 47% 54%), oklch(0.581 0.144 21.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Basashi Red color name →
#C15154
oklch(0.581 0.144 21.1)
Konwersje koloru
- HEX
- #c15154
- RGB
- rgb(193 81 84)
- HSL
- hsl(358 47% 54%)
- HWB
- hwb(358 32% 24%)
- OKLCH
- oklch(0.581 0.144 21.1)
- OKLab
- oklab(0.581 0.135 0.052)
- CIE Lab
- lab(49.86 46 22.16)
- LCH
- lch(49.86 51.06 25.7)
- CMYK
- cmyk(0% 58% 56% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C96364
- D17574
- D88685
- DF9896
- E6A9A7
- ECBAB8
- F1CBC9
- F6DCDB
- FBEEED
Odcienie ciemniejsze
- A74548
- 8F3A3C
- 772F31
- 5F2426
- 491A1B
- 341011
- 200708
- 0E0202
- 020000
Tony
- BC5759
- B65D5D
- B06262
- AA6766
- A46C6B
- 9E706F
- 977573
- 907978
- 887C7C
Harmonie kolorów
Komplementarna +180°
- C15154
Basashi Red
- 008B93
≈ Tempo Teal
Analogowa -30° +30°
- C15154
Basashi Red
- B85185
≈ Pink Pizzazz
- BB5C12
≈ Super Leaf Brown
Triada +120° +240°
- C15154
Basashi Red
- 438F37
≈ Putting Green
- 4778CF
≈ Serenity’s Reign
Komplementarna rozszczepiona +150° +210°
- C15154
Basashi Red
- 009072
≈ Observatory
- 0086B3
≈ Stomy Shower
Tetrada +90° +180° +270°
- C15154
Basashi Red
- 7E8100
≈ Drably Olive
- 008B93
≈ Tempo Teal
- 7C68C8
≈ Venus Violet
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.59:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.57:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.59:1 (AA) · APCA Lc 71
Contrast pairs
Fragmenty kodu
CSS
:root {
--basashi-red: #c15154;
--basashi-red-rgb: 193 81 84;
--basashi-red-oklch: oklch(0.581 0.144 21.1);
}
.element {
color: var(--basashi-red);
background-color: hsl(358 47% 54%);
border-color: oklch(0.581 0.144 21.1);
}Tailwind CSS v4
@theme {
--color-basashi-red: #c15154;
--color-basashi-red-50: #ffe6e2;
--color-basashi-red-100: #ffd6d1;
--color-basashi-red-200: #ffbcb7;
--color-basashi-red-300: #f99994;
--color-basashi-red-400: #e77979;
--color-basashi-red-500: #d5575b;
--color-basashi-red-600: #b44b4d;
--color-basashi-red-700: #903b3e;
--color-basashi-red-800: #6c2a2e;
--color-basashi-red-900: #4c1c1f;
--color-basashi-red-950: #320c0f;
}SCSS
$basashi-red: #c15154;
$basashi-red-rgb: 193, 81, 84;
$basashi-red-light: mix(#fff, $basashi-red, 20%);
$basashi-red-dark: mix(#000, $basashi-red, 20%);
.element {
color: $basashi-red;
box-shadow: 0 0 0 2px rgba($basashi-red, 0.35);
}