色名 · #EA9D4F
Sunflower Field
Sunflower Fieldは#EA9D4F：rgb(234 157 79)、hsl(30 79% 61%)、oklch(0.758 0.131 63.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Sunflower Field color name →
#EA9D4F
oklch(0.758 0.131 63.8)
カラー変換
- HEX
- #ea9d4f
- RGB
- rgb(234 157 79)
- HSL
- hsl(30 79% 61%)
- HWB
- hwb(30 31% 8%)
- OKLCH
- oklch(0.758 0.131 63.8)
- OKLab
- oklab(0.758 0.058 0.118)
- CIE Lab
- lab(71.52 24.4 51.92)
- LCH
- lch(71.52 57.36 64.8)
- CMYK
- cmyk(0% 33% 66% 8%)
ティント · シェード · トーン
ティント
- EDA763
- F0B176
- F2BB88
- F4C59A
- F7CFAB
- F9D8BC
- FBE2CD
- FCECDD
- FEF5EE
シェード
- CB8844
- AE7338
- 915F2E
- 754C23
- 5A3A19
- 412810
- 291807
- 130902
- 030100
トーン
- DF9B57
- D5985D
- CA9563
- C09369
- B5906E
- AB8D72
- A08A76
- 95877A
- 8B837D
カラーハーモニー
補色 +180°
- EA9D4F
Sunflower Field
- 5FB9FD
≈ Hello Summer
類似色 -30° +30°
- EA9D4F
Sunflower Field
- F89078
≈ Kissable
- CCAE40
≈ Sugar Leaves
トライアド +120° +240°
- EA9D4F
Sunflower Field
- 1ACBB9
≈ Exquisite Turquoise
- C29BF4
≈ Baby Purple
スプリットコンプリメンタリー +150° +210°
- EA9D4F
Sunflower Field
- 12C5E3
≈ Caribbean Blue
- 98AAFF
≈ Widowmaker
テトラード +90° +180° +270°
- EA9D4F
Sunflower Field
- 66C989
≈ Van Gogh Green
- 5FB9FD
≈ Hello Summer
- E290D3
≈ Love Dust
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.22:1 · APCA Lc 44
Ag
AAA黒の上
WCAG 9.43:1 · APCA Lc 59
最適な文字色: #000000
WCAG 9.43:1 (AAA) · APCA Lc 59
Contrast pairs
コードスニペット
CSS
:root {
--sunflower-field: #ea9d4f;
--sunflower-field-rgb: 234 157 79;
--sunflower-field-oklch: oklch(0.758 0.131 63.8);
}
.element {
color: var(--sunflower-field);
background-color: hsl(30 79% 61%);
border-color: oklch(0.758 0.131 63.8);
}Tailwind CSS v4
@theme {
--color-sunflower-field: #ea9d4f;
--color-sunflower-field-50: #ffeece;
--color-sunflower-field-100: #ffe0ba;
--color-sunflower-field-200: #fbca99;
--color-sunflower-field-300: #e5aa6d;
--color-sunflower-field-400: #d48c43;
--color-sunflower-field-500: #c16f00;
--color-sunflower-field-600: #a35f00;
--color-sunflower-field-700: #834c04;
--color-sunflower-field-800: #623603;
--color-sunflower-field-900: #452503;
--color-sunflower-field-950: #2c1300;
}SCSS
$sunflower-field: #ea9d4f;
$sunflower-field-rgb: 234, 157, 79;
$sunflower-field-light: mix(#fff, $sunflower-field, 20%);
$sunflower-field-dark: mix(#000, $sunflower-field, 20%);
.element {
color: $sunflower-field;
box-shadow: 0 0 0 2px rgba($sunflower-field, 0.35);
}