色名 · #F5AD75
Charming Peach
Charming Peachは#F5AD75：rgb(245 173 117)、hsl(26 86% 71%)、oklch(0.804 0.111 58.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Charming Peach color name →
#F5AD75
oklch(0.804 0.111 58.2)
カラー変換
- HEX
- #f5ad75
- RGB
- rgb(245 173 117)
- HSL
- hsl(26 86% 71%)
- HWB
- hwb(26 46% 4%)
- OKLCH
- oklch(0.804 0.111 58.2)
- OKLab
- oklab(0.804 0.059 0.094)
- CIE Lab
- lab(76.89 22.77 39.69)
- LCH
- lch(76.89 45.76 60.2)
- CMYK
- cmyk(0% 29% 52% 4%)
ティント · シェード · トーン
ティント
- F7B584
- F8BE92
- FAC6A0
- FBCEAD
- FCD6BB
- FDDFC9
- FEE7D6
- FEEFE4
- FFF7F1
シェード
- D59665
- B67F55
- 986A46
- 7B5537
- 5F4129
- 442D1C
- 2B1B0F
- 150B05
- 030101
トーン
- E9A977
- DDA479
- D1A07B
- C69C7C
- BA977D
- AE937E
- A38E7F
- 97897F
- 8C8580
カラーハーモニー
補色 +180°
- F5AD75
Charming Peach
- 76C9FF
≈ Bubbly Barracuda
類似色 -30° +30°
- F5AD75
Charming Peach
- FFA397
≈ Peach Amber
- DDBB66
≈ Termite Beige
トライアド +120° +240°
- F5AD75
Charming Peach
- 63D7BF
≈ Peppy
- C8AFFE
≈ Teasel Dipsacus
スプリットコンプリメンタリー +150° +210°
- F5AD75
Charming Peach
- 57D3E5
≈ Blue Radiance
- A4BDFF
≈ Pastel Blue
テトラード +90° +180° +270°
- F5AD75
Charming Peach
- 8CD397
≈ May Apple
- 76C9FF
≈ Bubbly Barracuda
- E7A5E3
≈ Candy Floss
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.88:1 · APCA Lc 36
Ag
AAA黒の上
WCAG 11.11:1 · APCA Lc 67
最適な文字色: #000000
WCAG 11.11:1 (AAA) · APCA Lc 67
Contrast pairs
コードスニペット
CSS
:root {
--charming-peach: #f5ad75;
--charming-peach-rgb: 245 173 117;
--charming-peach-oklch: oklch(0.804 0.111 58.2);
}
.element {
color: var(--charming-peach);
background-color: hsl(26 86% 71%);
border-color: oklch(0.804 0.111 58.2);
}Tailwind CSS v4
@theme {
--color-charming-peach: #f5ad75;
--color-charming-peach-50: #ffefd6;
--color-charming-peach-100: #ffe0c3;
--color-charming-peach-200: #f8caa5;
--color-charming-peach-300: #e2aa7d;
--color-charming-peach-400: #cf8d59;
--color-charming-peach-500: #bc7131;
--color-charming-peach-600: #9f602b;
--color-charming-peach-700: #7f4d22;
--color-charming-peach-800: #5f3718;
--color-charming-peach-900: #43260f;
--color-charming-peach-950: #2b1403;
}SCSS
$charming-peach: #f5ad75;
$charming-peach-rgb: 245, 173, 117;
$charming-peach-light: mix(#fff, $charming-peach, 20%);
$charming-peach-dark: mix(#000, $charming-peach, 20%);
.element {
color: $charming-peach;
box-shadow: 0 0 0 2px rgba($charming-peach, 0.35);
}