色名 · #BC3439
Stylish Red
Stylish Redは#BC3439：rgb(188 52 57)、hsl(358 57% 47%)、oklch(0.533 0.172 23.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Stylish Red color name →
#BC3439
oklch(0.533 0.172 23.4)
カラー変換
- HEX
- #bc3439
- RGB
- rgb(188 52 57)
- HSL
- hsl(358 57% 47%)
- HWB
- hwb(358 20% 26%)
- OKLCH
- oklch(0.533 0.172 23.4)
- OKLab
- oklab(0.533 0.158 0.068)
- CIE Lab
- lab(44.09 54.8 30.95)
- LCH
- lch(44.09 62.94 29.5)
- CMYK
- cmyk(0% 72% 70% 26%)
ティント · シェード · トーン
ティント
- C54C4C
- CE625F
- D67672
- DE8A86
- E59E99
- ECB1AD
- F1C4C1
- F7D8D5
- FBEBEA
シェード
- A32C30
- 8B2428
- 731C1F
- 5D1517
- 470E10
- 320709
- 1F0304
- 0D0101
- 020000
トーン
- B84041
- B34A48
- AE5250
- A95A57
- A3615E
- 9D6865
- 976F6C
- 907572
- 887A79
カラーハーモニー
補色 +180°
- BC3439
Stylish Red
- 007C84
≈ Cote D’Azur
類似色 -30° +30°
- BC3439
Stylish Red
- B33475
≈ Fuchsia Red
- A75200
≈ Windsor Brown
トライアド +120° +240°
- BC3439
Stylish Red
- 0A8416
≈ Lucky Clover
- 3565CF
≈ Janitor
スプリットコンプリメンタリー +150° +210°
- BC3439
Stylish Red
- 007F67
≈ Generic Viridian
- 0076A2
≈ Summer Lake
テトラード +90° +180° +270°
- BC3439
Stylish Red
- 6D7300
≈ Spinach Soup
- 007C84
≈ Cote D’Azur
- 7452C5
≈ Fuchsia Blue
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.69:1 · APCA Lc 77
Ag
Fail黒の上
WCAG 3.68:1 · APCA Lc 25
最適な文字色: #FFFFFF
WCAG 5.69:1 (AA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--stylish-red: #bc3439;
--stylish-red-rgb: 188 52 57;
--stylish-red-oklch: oklch(0.533 0.172 23.4);
}
.element {
color: var(--stylish-red);
background-color: hsl(358 57% 47%);
border-color: oklch(0.533 0.172 23.4);
}Tailwind CSS v4
@theme {
--color-stylish-red: #bc3439;
--color-stylish-red-50: #ffe3dc;
--color-stylish-red-100: #ffd2cb;
--color-stylish-red-200: #ffb7ae;
--color-stylish-red-300: #ff9289;
--color-stylish-red-400: #f36f6c;
--color-stylish-red-500: #e2484c;
--color-stylish-red-600: #be3f41;
--color-stylish-red-700: #993233;
--color-stylish-red-800: #722227;
--color-stylish-red-900: #51171a;
--color-stylish-red-950: #35070a;
}SCSS
$stylish-red: #bc3439;
$stylish-red-rgb: 188, 52, 57;
$stylish-red-light: mix(#fff, $stylish-red, 20%);
$stylish-red-dark: mix(#000, $stylish-red, 20%);
.element {
color: $stylish-red;
box-shadow: 0 0 0 2px rgba($stylish-red, 0.35);
}