色名 · #EECF9E
Peace Yellow
Peace Yellowは#EECF9E：rgb(238 207 158)、hsl(37 70% 78%)、oklch(0.869 0.073 78.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Peace Yellow color name →
#EECF9E
oklch(0.869 0.073 78.9)
カラー変換
- HEX
- #eecf9e
- RGB
- rgb(238 207 158)
- HSL
- hsl(37 70% 78%)
- HWB
- hwb(37 62% 7%)
- OKLCH
- oklch(0.869 0.073 78.9)
- OKLab
- oklab(0.869 0.014 0.071)
- CIE Lab
- lab(84.91 6.15 28.64)
- LCH
- lch(84.91 29.29 77.9)
- CMYK
- cmyk(0% 13% 34% 7%)
ティント · シェード · トーン
ティント
- F0D4A8
- F2D9B2
- F3DEBB
- F5E2C5
- F7E7CF
- F8ECD9
- FAF1E2
- FCF5EC
- FDFAF5
シェード
- CFB489
- B19974
- 937F60
- 77674D
- 5C4F3A
- 423829
- 2A2318
- 141009
- 030201
トーン
- E3C79B
- D7BF99
- CCB796
- C1AF93
- B6A790
- AB9F8D
- A0978A
- 958F87
- 8A8883
カラーハーモニー
補色 +180°
- EECF9E
Peace Yellow
- BBD6FF
≈ Oh Boy!
類似色 -30° +30°
- EECF9E
Peace Yellow
- FCC6AA
≈ Bright Citrus
- D7D8A1
≈ Garden Glade
トライアド +120° +240°
- EECF9E
Peace Yellow
- 9AE3E6
≈ Aqua Fiesta
- E9C5F3
≈ Purple’s Baby Sister
スプリットコンプリメンタリー +150° +210°
- EECF9E
Peace Yellow
- A2DEFA
≈ Columbia Blue
- D2CDFF
≈ Lavender Blue
テトラード +90° +180° +270°
- EECF9E
Peace Yellow
- A4E4CC
≈ Turquoise Tower
- BBD6FF
≈ Oh Boy!
- FAC1DB
≈ Miami Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.49:1 · APCA Lc 23
Ag
AAA黒の上
WCAG 14.05:1 · APCA Lc 80
最適な文字色: #000000
WCAG 14.05:1 (AAA) · APCA Lc 80
Contrast pairs
コードスニペット
CSS
:root {
--peace-yellow: #eecf9e;
--peace-yellow-rgb: 238 207 158;
--peace-yellow-oklch: oklch(0.869 0.073 78.9);
}
.element {
color: var(--peace-yellow);
background-color: hsl(37 70% 78%);
border-color: oklch(0.869 0.073 78.9);
}Tailwind CSS v4
@theme {
--color-peace-yellow: #eecf9e;
--color-peace-yellow-50: #fff4de;
--color-peace-yellow-100: #f5e6cd;
--color-peace-yellow-200: #e4d2b2;
--color-peace-yellow-300: #cbb48e;
--color-peace-yellow-400: #b69a6d;
--color-peace-yellow-500: #a0814c;
--color-peace-yellow-600: #876d41;
--color-peace-yellow-700: #6c5734;
--color-peace-yellow-800: #513f25;
--color-peace-yellow-900: #382b18;
--color-peace-yellow-950: #231909;
}SCSS
$peace-yellow: #eecf9e;
$peace-yellow-rgb: 238, 207, 158;
$peace-yellow-light: mix(#fff, $peace-yellow, 20%);
$peace-yellow-dark: mix(#000, $peace-yellow, 20%);
.element {
color: $peace-yellow;
box-shadow: 0 0 0 2px rgba($peace-yellow, 0.35);
}