色名 · #F9D3BE
Tuft Bush
Tuft Bushは#F9D3BE：rgb(249 211 190)、hsl(21 83% 86%)、oklch(0.894 0.051 50.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Tuft Bush color name →
#F9D3BE
oklch(0.894 0.051 50.6)
カラー変換
- HEX
- #f9d3be
- RGB
- rgb(249 211 190)
- HSL
- hsl(21 83% 86%)
- HWB
- hwb(21 75% 2%)
- OKLCH
- oklch(0.894 0.051 50.6)
- OKLab
- oklab(0.894 0.033 0.04)
- CIE Lab
- lab(87.43 11.44 15.64)
- LCH
- lch(87.43 19.38 53.8)
- CMYK
- cmyk(0% 15% 24% 2%)
ティント · シェード · トーン
ティント
- FAD7C4
- FBDCCB
- FBE0D1
- FCE5D8
- FDE9DE
- FDEDE5
- FEF2EB
- FEF6F2
- FFFBF8
シェード
- D9B7A5
- B99C8C
- 9A8275
- 7D695E
- 615148
- 463A33
- 2C241F
- 15100D
- 030202
トーン
- ECCAB8
- E0C2B1
- D3B9AB
- C7B1A5
- BBA99F
- AFA099
- A39892
- 97908C
- 8C8886
カラーハーモニー
補色 +180°
- F9D3BE
Tuft Bush
- BAE3F8
≈ Breaking the Ice
類似色 -30° +30°
- F9D3BE
Tuft Bush
- FCCFCE
≈ Fairy Tale Dream
- EED9B6
≈ Savon de Provence
トライアド +120° +240°
- F9D3BE
Tuft Bush
- BBE8D7
≈ Mint Ice
- DBD7FC
≈ Japan Blush
スプリットコンプリメンタリー +150° +210°
- F9D3BE
Tuft Bush
- B5E7EA
≈ Refreshing Pool
- C9DDFF
≈ Arc Light
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.39:1 · APCA Lc 19
Ag
AAA黒の上
WCAG 15.08:1 · APCA Lc 84
最適な文字色: #000000
WCAG 15.08:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--tuft-bush: #f9d3be;
--tuft-bush-rgb: 249 211 190;
--tuft-bush-oklch: oklch(0.894 0.051 50.6);
}
.element {
color: var(--tuft-bush);
background-color: hsl(21 83% 86%);
border-color: oklch(0.894 0.051 50.6);
}Tailwind CSS v4
@theme {
--color-tuft-bush: #f9d3be;
--color-tuft-bush-50: #fff2e8;
--color-tuft-bush-100: #f7e4d9;
--color-tuft-bush-200: #e7cfc1;
--color-tuft-bush-300: #ceb1a0;
--color-tuft-bush-400: #b89683;
--color-tuft-bush-500: #a37d67;
--color-tuft-bush-600: #896a58;
--color-tuft-bush-700: #6e5446;
--color-tuft-bush-800: #513d33;
--color-tuft-bush-900: #392a23;
--color-tuft-bush-950: #231812;
}SCSS
$tuft-bush: #f9d3be;
$tuft-bush-rgb: 249, 211, 190;
$tuft-bush-light: mix(#fff, $tuft-bush, 20%);
$tuft-bush-dark: mix(#000, $tuft-bush, 20%);
.element {
color: $tuft-bush;
box-shadow: 0 0 0 2px rgba($tuft-bush, 0.35);
}