色名 · #FFE195
Cheerful Hue
Cheerful Hueは#FFE195：rgb(255 225 149)、hsl(43 100% 79%)、oklch(0.918 0.1 88.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Cheerful Hue color name →
#FFE195
oklch(0.918 0.1 88.8)
カラー変換
- HEX
- #ffe195
- RGB
- rgb(255 225 149)
- HSL
- hsl(43 100% 79%)
- HWB
- hwb(43 58% 0%)
- OKLCH
- oklch(0.918 0.1 88.8)
- OKLab
- oklab(0.918 0.002 0.1)
- CIE Lab
- lab(90.8 3.33 41.13)
- LCH
- lch(90.8 41.27 85.4)
- CMYK
- cmyk(0% 12% 42% 0%)
ティント · シェード · トーン
ティント
- FFE4A1
- FFE7AC
- FFEAB7
- FFEDC1
- FFF0CC
- FFF3D6
- FFF6E1
- FFF9EB
- FFFCF5
シェード
- DEC481
- BEA76D
- 9E8B5A
- 807048
- 635637
- 483E26
- 2E2716
- 161208
- 030201
トーン
- F2D794
- E4CD92
- D7C391
- CAB98F
- BEB08D
- B1A68B
- A49C88
- 989386
- 8C8983
カラーハーモニー
補色 +180°
- FFE195
Cheerful Hue
- D9E4FF
≈ Stoic White
類似色 -30° +30°
- FFE195
Cheerful Hue
- FFDCC3
≈ Whispering Peach
- DCEEA1
≈ Mint Julep
トライアド +120° +240°
- FFE195
Cheerful Hue
- A7F3FF
≈ Waterspout
- FFD4FB
≈ Pink Diamond
スプリットコンプリメンタリー +150° +210°
- FFE195
Cheerful Hue
- CAE9FF
≈ Blue Java Banana
- E7DEFF
≈ Lavender Savour
テトラード +90° +180° +270°
- FFE195
Cheerful Hue
- 95FAE5
≈ Defence Matrix
- D9E4FF
≈ Stoic White
- FFD8E3
≈ Pink Supremecy
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.27:1 · APCA Lc 14
Ag
AAA黒の上
WCAG 16.45:1 · APCA Lc 90
最適な文字色: #000000
WCAG 16.45:1 (AAA) · APCA Lc 90
Contrast pairs
コードスニペット
CSS
:root {
--cheerful-hue: #ffe195;
--cheerful-hue-rgb: 255 225 149;
--cheerful-hue-oklch: oklch(0.918 0.1 88.8);
}
.element {
color: var(--cheerful-hue);
background-color: hsl(43 100% 79%);
border-color: oklch(0.918 0.1 88.8);
}Tailwind CSS v4
@theme {
--color-cheerful-hue: #ffe195;
--color-cheerful-hue-50: #fff5d5;
--color-cheerful-hue-100: #f4e7c3;
--color-cheerful-hue-200: #e4d3a4;
--color-cheerful-hue-300: #cbb67b;
--color-cheerful-hue-400: #b69b55;
--color-cheerful-hue-500: #a1822a;
--color-cheerful-hue-600: #886e26;
--color-cheerful-hue-700: #6d581e;
--color-cheerful-hue-800: #514013;
--color-cheerful-hue-900: #392c0c;
--color-cheerful-hue-950: #231901;
}SCSS
$cheerful-hue: #ffe195;
$cheerful-hue-rgb: 255, 225, 149;
$cheerful-hue-light: mix(#fff, $cheerful-hue, 20%);
$cheerful-hue-dark: mix(#000, $cheerful-hue, 20%);
.element {
color: $cheerful-hue;
box-shadow: 0 0 0 2px rgba($cheerful-hue, 0.35);
}