色名 · #BB5F34
Smoke Tree
Smoke Treeは#BB5F34：rgb(187 95 52)、hsl(19 56% 47%)、oklch(0.588 0.132 44.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Smoke Tree color name →
#BB5F34
oklch(0.588 0.132 44.2)
カラー変換
- HEX
- #bb5f34
- RGB
- rgb(187 95 52)
- HSL
- hsl(19 56% 47%)
- HWB
- hwb(19 20% 27%)
- OKLCH
- oklch(0.588 0.132 44.2)
- OKLab
- oklab(0.588 0.094 0.092)
- CIE Lab
- lab(51.23 35.57 41.47)
- LCH
- lch(51.23 54.63 49.4)
- CMYK
- cmyk(0% 49% 72% 27%)
ティント · シェード · トーン
ティント
- C36F4A
- CB7F5E
- D38F72
- DA9F86
- E1AF9A
- E7BFAE
- EECFC2
- F4DFD6
- FAEFEA
シェード
- A2522C
- 8A4424
- 73381C
- 5C2C15
- 46200E
- 321507
- 1F0A03
- 0D0301
- 020000
トーン
- B6633E
- B16747
- AB6B4F
- A66F57
- A0725E
- 9A7565
- 94786C
- 8E7B73
- 877D79
カラーハーモニー
補色 +180°
- BB5F34
Smoke Tree
- 008AAD
≈ Corfu Waters
類似色 -30° +30°
- BB5F34
Smoke Tree
- BD5764
≈ Hibiscus Flower
- A86F00
≈ Cookie Dough
トライアド +120° +240°
- BB5F34
Smoke Tree
- 009368
≈ Viridian
- 746FC7
≈ Purple Toolbox
スプリットコンプリメンタリー +150° +210°
- BB5F34
Smoke Tree
- 008F8E
≈ Corfu Shallows
- 3F7EC8
≈ Tufts Blue
テトラード +90° +180° +270°
- BB5F34
Smoke Tree
- 5A8D35
≈ Maximum Green
- 008AAD
≈ Corfu Waters
- 9962B2
≈ Prickly Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.37:1 · APCA Lc 70
Ag
AA黒の上
WCAG 4.79:1 · APCA Lc 32
最適な文字色: #000000
WCAG 4.79:1 (AA) · APCA Lc 32
Contrast pairs
コードスニペット
CSS
:root {
--smoke-tree: #bb5f34;
--smoke-tree-rgb: 187 95 52;
--smoke-tree-oklch: oklch(0.588 0.132 44.2);
}
.element {
color: var(--smoke-tree);
background-color: hsl(19 56% 47%);
border-color: oklch(0.588 0.132 44.2);
}Tailwind CSS v4
@theme {
--color-smoke-tree: #bb5f34;
--color-smoke-tree-50: #ffead6;
--color-smoke-tree-100: #ffdbc3;
--color-smoke-tree-200: #ffc3a5;
--color-smoke-tree-300: #f0a27d;
--color-smoke-tree-400: #de835b;
--color-smoke-tree-500: #cb6534;
--color-smoke-tree-600: #ac562d;
--color-smoke-tree-700: #8a4424;
--color-smoke-tree-800: #67311a;
--color-smoke-tree-900: #492111;
--color-smoke-tree-950: #2f1004;
}SCSS
$smoke-tree: #bb5f34;
$smoke-tree-rgb: 187, 95, 52;
$smoke-tree-light: mix(#fff, $smoke-tree, 20%);
$smoke-tree-dark: mix(#000, $smoke-tree, 20%);
.element {
color: $smoke-tree;
box-shadow: 0 0 0 2px rgba($smoke-tree, 0.35);
}