最も近い色名 · #FC4CCF
#FC4CCF
最も近い色名: Purple Pizzazz
#FC4CCF（rgb(252 76 207)、hsl(315 97% 64%)、oklch(0.705 0.247 340)）に最も近い色名はPurple Pizzazzです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#FC4CCF
oklch(0.705 0.247 340)
カラー変換
- HEX
- #fc4ccf
- RGB
- rgb(252 76 207)
- HSL
- hsl(315 97% 64%)
- HWB
- hwb(315 30% 1%)
- OKLCH
- oklch(0.705 0.247 340)
- OKLab
- oklab(0.705 0.232 -0.085)
- CIE Lab
- lab(62.19 75.52 -30.53)
- LCH
- lch(62.19 81.46 338)
- CMYK
- cmyk(0% 70% 18% 1%)
ティント · シェード · トーン
ティント
- FF64D4
- FF78D9
- FF8BDE
- FF9DE3
- FFAEE8
- FFBFED
- FFCFF1
- FFDFF6
- FFEFFB
シェード
- DB41B4
- BB3699
- 9C2C7F
- 7E2267
- 62184F
- 470F38
- 2D0623
- 160210
- 030002
トーン
- F056C7
- E55EBF
- D965B7
- CD6BAF
- C170A8
- B574A0
- A87898
- 9B7B90
- 8E7E88
カラーハーモニー
補色 +180°
- FC4CCF
Purple Pizzazz
- 00BD7D
≈ Fennel Fiesta
類似色 -30° +30°
- FC4CCF
Purple Pizzazz
- C772FF
≈ Easter Purple
- FF6184
≈ Brink Pink
トライアド +120° +240°
- FC4CCF
Purple Pizzazz
- B6A100
≈ Snakebite Leather
- 00B2D7
≈ Aquarius
スプリットコンプリメンタリー +150° +210°
- FC4CCF
Purple Pizzazz
- 77B500
≈ Leaf Sheep
- 00B8B1
≈ Jade Gravel
テトラード +90° +180° +270°
- FC4CCF
Purple Pizzazz
- DB8C00
≈ Non-Stop Orange
- 00BD7D
≈ Fennel Fiesta
- 44A4FF
≈ Xed
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.96:1 · APCA Lc 55
Ag
AAA黒の上
WCAG 7.07:1 · APCA Lc 47
最適な文字色: #000000
WCAG 7.07:1 (AAA) · APCA Lc 47
Contrast pairs
コードスニペット
CSS
:root {
--purple-pizzazz: #fc4ccf;
--purple-pizzazz-rgb: 252 76 207;
--purple-pizzazz-oklch: oklch(0.705 0.247 340);
}
.element {
color: var(--purple-pizzazz);
background-color: hsl(315 97% 64%);
border-color: oklch(0.705 0.247 340);
}Tailwind CSS v4
@theme {
--color-purple-pizzazz: #fc4ccf;
--color-purple-pizzazz-50: #ffd9ff;
--color-purple-pizzazz-100: #ffc7ff;
--color-purple-pizzazz-200: #ffa8f2;
--color-purple-pizzazz-300: #ff7dda;
--color-purple-pizzazz-400: #f652cb;
--color-purple-pizzazz-500: #e500b8;
--color-purple-pizzazz-600: #c10a9b;
--color-purple-pizzazz-700: #9b0c7d;
--color-purple-pizzazz-800: #73075f;
--color-purple-pizzazz-900: #510643;
--color-purple-pizzazz-950: #36002b;
}SCSS
$purple-pizzazz: #fc4ccf;
$purple-pizzazz-rgb: 252, 76, 207;
$purple-pizzazz-light: mix(#fff, $purple-pizzazz, 20%);
$purple-pizzazz-dark: mix(#000, $purple-pizzazz, 20%);
.element {
color: $purple-pizzazz;
box-shadow: 0 0 0 2px rgba($purple-pizzazz, 0.35);
}