色名 · #FFDAB9
Peach Puff
Peach Puffは#FFDAB9：rgb(255 218 185)、hsl(28 100% 86%)、oklch(0.911 0.06 63.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Peach Puff color name →
#FFDAB9
oklch(0.911 0.06 63.7)
カラー変換
- HEX
- #ffdab9
- RGB
- rgb(255 218 185)
- HSL
- hsl(28 100% 86%)
- HWB
- hwb(28 73% 0%)
- OKLCH
- oklch(0.911 0.06 63.7)
- OKLab
- oklab(0.911 0.027 0.054)
- CIE Lab
- lab(89.6 9.78 21.32)
- LCH
- lch(89.6 23.46 65.4)
- CMYK
- cmyk(0% 15% 27% 0%)
ティント · シェード · トーン
ティント
- FFDEC0
- FFE1C7
- FFE5CE
- FFE9D5
- FFEDDC
- FFF0E3
- FFF4EA
- FFF8F1
- FFFBF8
シェード
- DEBDA0
- BEA289
- 9E8771
- 806C5B
- 635446
- 483C31
- 2E251E
- 16110D
- 030202
トーン
- F2D1B3
- E5C7AE
- D8BEA8
- CBB5A2
- BEAC9D
- B1A397
- A59A91
- 98918B
- 8C8986
カラーハーモニー
補色 +180°
- FFDAB9
Peach Puff
- C8E6FF
≈ Icy Landscape
類似色 -30° +30°
- FFDAB9
Peach Puff
- FFD7CE
≈ Shy Girl
- EFE2B5
≈ Buttered
トライアド +120° +240°
- FFDAB9
Peach Puff
- B6EFE6
≈ East Cape
- E9DAFF
≈ Lavender Savour
スプリットコンプリメンタリー +150° +210°
- FFDAB9
Peach Puff
- B4EDFA
≈ Ice Effect
- D8E0FF
≈ Contrail
テトラード +90° +180° +270°
- FFDAB9
Peach Puff
- C4EED0
≈ Spatial Spirit
- C8E6FF
≈ Icy Landscape
- FBD4F3
≈ Jacaranda
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.31:1 · APCA Lc 16
Ag
AAA黒の上
WCAG 15.98:1 · APCA Lc 88
最適な文字色: #000000
WCAG 15.98:1 (AAA) · APCA Lc 88
Contrast pairs
コードスニペット
CSS
:root {
--peach-puff: #ffdab9;
--peach-puff-rgb: 255 218 185;
--peach-puff-oklch: oklch(0.911 0.06 63.7);
}
.element {
color: var(--peach-puff);
background-color: hsl(28 100% 86%);
border-color: oklch(0.911 0.06 63.7);
}Tailwind CSS v4
@theme {
--color-peach-puff: #ffdab9;
--color-peach-puff-50: #fff2e4;
--color-peach-puff-100: #f6e4d3;
--color-peach-puff-200: #e7d0ba;
--color-peach-puff-300: #cdb298;
--color-peach-puff-400: #b8977a;
--color-peach-puff-500: #a37e5c;
--color-peach-puff-600: #8a6b4e;
--color-peach-puff-700: #6e553e;
--color-peach-puff-800: #523e2d;
--color-peach-puff-900: #392a1e;
--color-peach-puff-950: #23180e;
}SCSS
$peach-puff: #ffdab9;
$peach-puff-rgb: 255, 218, 185;
$peach-puff-light: mix(#fff, $peach-puff, 20%);
$peach-puff-dark: mix(#000, $peach-puff, 20%);
.element {
color: $peach-puff;
box-shadow: 0 0 0 2px rgba($peach-puff, 0.35);
}