色名 · #80304C
Beaujolais
Beaujolaisは#80304C：rgb(128 48 76)、hsl(339 45% 35%)、oklch(0.431 0.114 1.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Beaujolais color name →
#80304C
oklch(0.431 0.114 1.3)
カラー変換
- HEX
- #80304c
- RGB
- rgb(128 48 76)
- HSL
- hsl(339 45% 35%)
- HWB
- hwb(339 19% 50%)
- OKLCH
- oklch(0.431 0.114 1.3)
- OKLab
- oklab(0.431 0.114 0.003)
- CIE Lab
- lab(32.61 37.18 1.52)
- LCH
- lch(32.61 37.21 2.3)
- CMYK
- cmyk(0% 63% 41% 50%)
ティント · シェード · トーン
ティント
- 8E455C
- 9B586D
- A96C7E
- B6808F
- C395A1
- CFA9B3
- DBBEC5
- E7D4D8
- F3E9EC
シェード
- 6E2841
- 5D2136
- 4D1A2C
- 3D1322
- 2E0C18
- 1F060F
- 120306
- 060102
- 010000
トーン
- 813951
- 824256
- 834A5B
- 835260
- 845A65
- 84626B
- 836970
- 827175
- 81787B
カラーハーモニー
補色 +180°
- 80304C
Beaujolais
- 005E53
≈ Alpine Green
類似色 -30° +30°
- 80304C
Beaujolais
- 72356C
≈ Ayame Iris
- 833326
≈ Warmth of Teamwork
トライアド +120° +240°
- 80304C
Beaujolais
- 485800
≈ Lustrian Undergrowth
- 005582
≈ Grand Bleu
スプリットコンプリメンタリー +150° +210°
- 80304C
Beaujolais
- 03612D
≈ Ficus Elastica
- 005B68
≈ Egyptian Enamel
テトラード +90° +180° +270°
- 80304C
Beaujolais
- 624E00
≈ Olive Brown
- 005E53
≈ Alpine Green
- 3A4A8E
≈ Blue Highlight
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.58:1 · APCA Lc 89
Ag
Fail黒の上
WCAG 2.44:1 · APCA Lc 13
最適な文字色: #FFFFFF
WCAG 8.58:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--beaujolais: #80304c;
--beaujolais-rgb: 128 48 76;
--beaujolais-oklch: oklch(0.431 0.114 1.3);
}
.element {
color: var(--beaujolais);
background-color: hsl(339 45% 35%);
border-color: oklch(0.431 0.114 1.3);
}Tailwind CSS v4
@theme {
--color-beaujolais: #80304c;
--color-beaujolais-50: #ffe8f2;
--color-beaujolais-100: #ffd9e4;
--color-beaujolais-200: #ffc1cf;
--color-beaujolais-300: #e99fb1;
--color-beaujolais-400: #d6819a;
--color-beaujolais-500: #c26381;
--color-beaujolais-600: #a4546d;
--color-beaujolais-700: #844357;
--color-beaujolais-800: #613041;
--color-beaujolais-900: #44212d;
--color-beaujolais-950: #2c101a;
}SCSS
$beaujolais: #80304c;
$beaujolais-rgb: 128, 48, 76;
$beaujolais-light: mix(#fff, $beaujolais, 20%);
$beaujolais-dark: mix(#000, $beaujolais, 20%);
.element {
color: $beaujolais;
box-shadow: 0 0 0 2px rgba($beaujolais, 0.35);
}