色名 · #FDE6D6
Winthrop Peach
Winthrop Peachは#FDE6D6：rgb(253 230 214)、hsl(25 91% 92%)、oklch(0.939 0.033 57.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Winthrop Peach color name →
#FDE6D6
oklch(0.939 0.033 57.1)
カラー変換
- HEX
- #fde6d6
- RGB
- rgb(253 230 214)
- HSL
- hsl(25 91% 92%)
- HWB
- hwb(25 84% 1%)
- OKLCH
- oklch(0.939 0.033 57.1)
- OKLab
- oklab(0.939 0.018 0.028)
- CIE Lab
- lab(92.86 6.24 10.82)
- LCH
- lch(92.86 12.5 60)
- CMYK
- cmyk(0% 9% 15% 1%)
ティント · シェード · トーン
ティント
- FDE9DA
- FEEBDE
- FEEEE2
- FEF0E6
- FEF3EA
- FEF5EF
- FFF8F3
- FFFAF7
- FFFDFB
シェード
- DCC8BA
- BCAB9E
- 9D8E84
- 7F736A
- 625952
- 47403B
- 2D2825
- 161310
- 030302
トーン
- F0DBCD
- E3D1C4
- D6C6BB
- C9BCB3
- BDB2AA
- B0A8A2
- A49D99
- 989491
- 8C8A88
カラーハーモニー
補色 +180°
- FDE6D6
Winthrop Peach
- D7EFFF
≈ Ice Castle
類似色 -30° +30°
- FDE6D6
Winthrop Peach
- FFE4E0
≈ Misty Rose
- F4EAD2
≈ Vanilla Wafer
トライアド +120° +240°
- FDE6D6
Winthrop Peach
- D5F3EA
≈ Slippery Tub
- EDE7FF
≈ Bright Dusk
スプリットコンプリメンタリー +150° +210°
- FDE6D6
Winthrop Peach
- D3F2F6
≈ Windswept
- E2EBFF
≈ Husky
テトラード +90° +180° +270°
- FDE6D6
Winthrop Peach
- DDF1DE
≈ Tara
- D7EFFF
≈ Ice Castle
- F8E4F7
≈ Soft Lavender
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.20:1 · APCA Lc 10
Ag
AAA黒の上
WCAG 17.46:1 · APCA Lc 94
最適な文字色: #000000
WCAG 17.46:1 (AAA) · APCA Lc 94
Contrast pairs
コードスニペット
CSS
:root {
--winthrop-peach: #fde6d6;
--winthrop-peach-rgb: 253 230 214;
--winthrop-peach-oklch: oklch(0.939 0.033 57.1);
}
.element {
color: var(--winthrop-peach);
background-color: hsl(25 91% 92%);
border-color: oklch(0.939 0.033 57.1);
}Tailwind CSS v4
@theme {
--color-winthrop-peach: #fde6d6;
--color-winthrop-peach-50: #fdf3ec;
--color-winthrop-peach-100: #f1e6dd;
--color-winthrop-peach-200: #dfd1c7;
--color-winthrop-peach-300: #c5b4a7;
--color-winthrop-peach-400: #ae9a8c;
--color-winthrop-peach-500: #988171;
--color-winthrop-peach-600: #806d60;
--color-winthrop-peach-700: #67574d;
--color-winthrop-peach-800: #4c4038;
--color-winthrop-peach-900: #352c26;
--color-winthrop-peach-950: #201914;
}SCSS
$winthrop-peach: #fde6d6;
$winthrop-peach-rgb: 253, 230, 214;
$winthrop-peach-light: mix(#fff, $winthrop-peach, 20%);
$winthrop-peach-dark: mix(#000, $winthrop-peach, 20%);
.element {
color: $winthrop-peach;
box-shadow: 0 0 0 2px rgba($winthrop-peach, 0.35);
}