色名 · #FFE9C7
Barely Peach
Barely Peachは#FFE9C7：rgb(255 233 199)、hsl(36 100% 89%)、oklch(0.943 0.05 78.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Barely Peach color name →
#FFE9C7
oklch(0.943 0.05 78.7)
カラー変換
- HEX
- #ffe9c7
- RGB
- rgb(255 233 199)
- HSL
- hsl(36 100% 89%)
- HWB
- hwb(36 78% 0%)
- OKLCH
- oklch(0.943 0.05 78.7)
- OKLab
- oklab(0.943 0.01 0.05)
- CIE Lab
- lab(93.51 3.92 19.46)
- LCH
- lch(93.51 19.85 78.6)
- CMYK
- cmyk(0% 9% 22% 0%)
ティント · シェード · トーン
ティント
- FFEBCD
- FFEDD2
- FFF0D8
- FFF2DE
- FFF4E3
- FFF6E9
- FFF8EE
- FFFBF4
- FFFDF9
シェード
- DECBAD
- BEAD93
- 9E907A
- 807462
- 635A4C
- 484136
- 2E2921
- 16130E
- 030302
トーン
- F2DEC0
- E4D3B9
- D7C8B1
- CABEAA
- BEB3A3
- B1A99C
- A49E95
- 98948E
- 8C8A87
カラーハーモニー
補色 +180°
- FFE9C7
Barely Peach
- E1EDFF
≈ Calcareous Sinter
類似色 -30° +30°
- FFE9C7
Barely Peach
- FFE7DA
≈ Light Peach Rose
- EEF0C9
≈ Passionate Pause
トライアド +120° +240°
- FFE9C7
Barely Peach
- C6F7F9
≈ Vaporised
- F9E4FF
≈ Soft Lavender
スプリットコンプリメンタリー +150° +210°
- FFE9C7
Barely Peach
- D6F1FF
≈ Water
- EBEAFF
≈ Bright Dusk
テトラード +90° +180° +270°
- FFE9C7
Barely Peach
- CCF8E6
≈ Cactus Water
- E1EDFF
≈ Calcareous Sinter
- FFE3F0
≈ Bunny Tail
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黒の上
WCAG 17.73:1 · APCA Lc 95
最適な文字色: #000000
WCAG 17.73:1 (AAA) · APCA Lc 95
Contrast pairs
コードスニペット
CSS
:root {
--barely-peach: #ffe9c7;
--barely-peach-rgb: 255 233 199;
--barely-peach-oklch: oklch(0.943 0.05 78.7);
}
.element {
color: var(--barely-peach);
background-color: hsl(36 100% 89%);
border-color: oklch(0.943 0.05 78.7);
}Tailwind CSS v4
@theme {
--color-barely-peach: #ffe9c7;
--color-barely-peach-50: #fdf4e5;
--color-barely-peach-100: #f1e7d5;
--color-barely-peach-200: #e0d2bd;
--color-barely-peach-300: #c5b59b;
--color-barely-peach-400: #af9b7d;
--color-barely-peach-500: #998360;
--color-barely-peach-600: #816f52;
--color-barely-peach-700: #675841;
--color-barely-peach-800: #4c402f;
--color-barely-peach-900: #352c20;
--color-barely-peach-950: #20190f;
}SCSS
$barely-peach: #ffe9c7;
$barely-peach-rgb: 255, 233, 199;
$barely-peach-light: mix(#fff, $barely-peach, 20%);
$barely-peach-dark: mix(#000, $barely-peach, 20%);
.element {
color: $barely-peach;
box-shadow: 0 0 0 2px rgba($barely-peach, 0.35);
}