色名 · #BA622A
Hell’s Bells
Hell’s Bellsは#BA622A：rgb(186 98 42)、hsl(23 63% 45%)、oklch(0.59 0.132 49.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Hell’s Bells color name →
#BA622A
oklch(0.59 0.132 49.8)
カラー変換
- HEX
- #ba622a
- RGB
- rgb(186 98 42)
- HSL
- hsl(23 63% 45%)
- HWB
- hwb(23 16% 27%)
- OKLCH
- oklch(0.59 0.132 49.8)
- OKLab
- oklab(0.59 0.085 0.101)
- CIE Lab
- lab(51.63 33.33 46.71)
- LCH
- lch(51.63 57.38 54.5)
- CMYK
- cmyk(0% 47% 77% 27%)
ティント · シェード · トーン
ティント
- C27243
- CA8259
- D2916E
- D9A182
- E0B097
- E7C0AB
- EDD0C0
- F3DFD5
- F9EFEA
シェード
- A15423
- 89471C
- 723A16
- 5C2D10
- 46210A
- 321605
- 1E0B02
- 0D0301
- 020000
トーン
- B56636
- B06A41
- AA6D4A
- A57053
- 9F735B
- 9A7663
- 94796B
- 8D7B72
- 877E79
カラーハーモニー
補色 +180°
- BA622A
Hell’s Bells
- 0089B5
≈ Stomy Shower
類似色 -30° +30°
- BA622A
Hell’s Bells
- BF585C
≈ Pimm’s
- A37300
≈ Barbarian Leather
トライアド +120° +240°
- BA622A
Hell’s Bells
- 009372
≈ Dòu Lǜ Green
- 7D6DC6
≈ Venus Violet
スプリットコンプリメンタリー +150° +210°
- BA622A
Hell’s Bells
- 008F94
≈ Christina Brown
- 4C7CCB
≈ Serenity’s Reign
テトラード +90° +180° +270°
- BA622A
Hell’s Bells
- 4F903F
≈ May Green
- 0089B5
≈ Stomy Shower
- 9F61AE
≈ Prickly Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.31:1 · APCA Lc 69
Ag
AA黒の上
WCAG 4.86:1 · APCA Lc 32
最適な文字色: #000000
WCAG 4.86:1 (AA) · APCA Lc 32
Contrast pairs
コードスニペット
CSS
:root {
--hell-s-bells: #ba622a;
--hell-s-bells-rgb: 186 98 42;
--hell-s-bells-oklch: oklch(0.59 0.132 49.8);
}
.element {
color: var(--hell-s-bells);
background-color: hsl(23 63% 45%);
border-color: oklch(0.59 0.132 49.8);
}Tailwind CSS v4
@theme {
--color-hell-s-bells: #ba622a;
--color-hell-s-bells-50: #ffebd3;
--color-hell-s-bells-100: #ffdcc0;
--color-hell-s-bells-200: #ffc5a0;
--color-hell-s-bells-300: #eea477;
--color-hell-s-bells-400: #dc8553;
--color-hell-s-bells-500: #c96726;
--color-hell-s-bells-600: #aa5823;
--color-hell-s-bells-700: #89461c;
--color-hell-s-bells-800: #663214;
--color-hell-s-bells-900: #48220d;
--color-hell-s-bells-950: #2f1102;
}SCSS
$hell-s-bells: #ba622a;
$hell-s-bells-rgb: 186, 98, 42;
$hell-s-bells-light: mix(#fff, $hell-s-bells, 20%);
$hell-s-bells-dark: mix(#000, $hell-s-bells, 20%);
.element {
color: $hell-s-bells;
box-shadow: 0 0 0 2px rgba($hell-s-bells, 0.35);
}