最も近い色名 · #D8B246
#D8B246
最も近い色名: Haystack
#D8B246（rgb(216 178 70)、hsl(44 65% 56%)、oklch(0.778 0.131 89.4)）に最も近い色名はHaystackです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#D8B246
oklch(0.778 0.131 89.4)
カラー変換
- HEX
- #d8b246
- RGB
- rgb(216 178 70)
- HSL
- hsl(44 65% 56%)
- HWB
- hwb(44 27% 15%)
- OKLCH
- oklch(0.778 0.131 89.4)
- OKLab
- oklab(0.778 0.001 0.131)
- CIE Lab
- lab(74.55 5.87 58.31)
- LCH
- lch(74.55 58.6 84.3)
- CMYK
- cmyk(0% 18% 68% 15%)
ティント · シェード · トーン
ティント
- DCBA5D
- E0C272
- E4CA85
- E8D197
- ECD9A9
- EFE1BB
- F3E8CC
- F7F0DD
- FBF7EE
シェード
- BC9A3C
- A08332
- 856D28
- 6B571E
- 534315
- 3B2F0D
- 251D05
- 110C02
- 020100
トーン
- CFAD50
- C6A859
- BDA360
- B49E66
- AB996C
- A29471
- 9A8F75
- 918A79
- 88857D
カラーハーモニー
補色 +180°
- D8B246
Haystack
- 9AB3FF
≈ Wondrous Wisteria
類似色 -30° +30°
- D8B246
Haystack
- F4A15A
≈ Sandy Brown
- ADC35C
≈ Green Glow
トライアド +120° +240°
- D8B246
Haystack
- 18CDE4
≈ Picnic Day Sky
- E597DF
≈ Love Dust
スプリットコンプリメンタリー +150° +210°
- D8B246
Haystack
- 60C1FF
≈ Blue Mana
- C3A3FF
≈ Diva
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.02:1 · APCA Lc 39
Ag
AAA黒の上
WCAG 10.37:1 · APCA Lc 63
最適な文字色: #000000
WCAG 10.37:1 (AAA) · APCA Lc 63
Contrast pairs
コードスニペット
CSS
:root {
--haystack: #d8b246;
--haystack-rgb: 216 178 70;
--haystack-oklch: oklch(0.778 0.131 89.4);
}
.element {
color: var(--haystack);
background-color: hsl(44 65% 56%);
border-color: oklch(0.778 0.131 89.4);
}Tailwind CSS v4
@theme {
--color-haystack: #d8b246;
--color-haystack-50: #fff5cb;
--color-haystack-100: #f8e7b6;
--color-haystack-200: #e9d393;
--color-haystack-300: #d0b565;
--color-haystack-400: #bd9a32;
--color-haystack-500: #a98000;
--color-haystack-600: #8e6c00;
--color-haystack-700: #725700;
--color-haystack-800: #563e00;
--color-haystack-900: #3c2b00;
--color-haystack-950: #261800;
}SCSS
$haystack: #d8b246;
$haystack-rgb: 216, 178, 70;
$haystack-light: mix(#fff, $haystack, 20%);
$haystack-dark: mix(#000, $haystack, 20%);
.element {
color: $haystack;
box-shadow: 0 0 0 2px rgba($haystack, 0.35);
}