色名 · #FF6CB5
Fěn Hóng Pink
Fěn Hóng Pinkは#FF6CB5：rgb(255 108 181)、hsl(330 100% 71%)、oklch(0.732 0.193 352)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Fěn Hóng Pink color name →
#FF6CB5
oklch(0.732 0.193 352)
カラー変換
- HEX
- #ff6cb5
- RGB
- rgb(255 108 181)
- HSL
- hsl(330 100% 71%)
- HWB
- hwb(330 42% 0%)
- OKLCH
- oklch(0.732 0.193 352)
- OKLab
- oklab(0.732 0.191 -0.027)
- CIE Lab
- lab(66.37 62.11 -9.46)
- LCH
- lch(66.37 62.82 351.3)
- CMYK
- cmyk(0% 58% 29% 0%)
ティント · シェード · トーン
ティント
- FF7DBC
- FF8DC4
- FF9CCB
- FFABD2
- FFB9DA
- FFC7E1
- FFD5E8
- FFE3F0
- FFF1F7
シェード
- DE5D9D
- BE4E86
- 9E406F
- 803259
- 632544
- 481930
- 2E0D1D
- 16040C
- 030002
トーン
- F370B0
- E773AA
- DB76A5
- CE79A0
- C27B9A
- B57C95
- A87E90
- 9B7F8A
- 8E8085
カラーハーモニー
補色 +180°
- FF6CB5
Fěn Hóng Pink
- 00C59E
≈ Jadeite
類似色 -30° +30°
- FF6CB5
Fěn Hóng Pink
- DF79EF
≈ Pink Bonnet
- FF7978
≈ Embarrassment
トライアド +120° +240°
- FF6CB5
Fěn Hóng Pink
- ACB100
≈ Mustard Green
- 00B7F5
≈ Zima Blue
スプリットコンプリメンタリー +150° +210°
- FF6CB5
Fěn Hóng Pink
- 53C549
≈ Zunda Green
- 00BFCA
≈ Panorama Blue
テトラード +90° +180° +270°
- FF6CB5
Fěn Hóng Pink
- D79D00
≈ Immortelle Yellow
- 00C59E
≈ Jadeite
- 78A7FF
≈ Fennel Flower
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.60:1 · APCA Lc 50
Ag
AAA黒の上
WCAG 8.06:1 · APCA Lc 52
最適な文字色: #000000
WCAG 8.06:1 (AAA) · APCA Lc 52
Contrast pairs
コードスニペット
CSS
:root {
--fen-hong-pink: #ff6cb5;
--fen-hong-pink-rgb: 255 108 181;
--fen-hong-pink-oklch: oklch(0.732 0.193 352);
}
.element {
color: var(--fen-hong-pink);
background-color: hsl(330 100% 71%);
border-color: oklch(0.732 0.193 352);
}Tailwind CSS v4
@theme {
--color-fen-hong-pink: #ff6cb5;
--color-fen-hong-pink-50: #ffdff9;
--color-fen-hong-pink-100: #ffceec;
--color-fen-hong-pink-200: #ffb1da;
--color-fen-hong-pink-300: #ff8abe;
--color-fen-hong-pink-400: #f066aa;
--color-fen-hong-pink-500: #de3b93;
--color-fen-hong-pink-600: #bb347d;
--color-fen-hong-pink-700: #972a64;
--color-fen-hong-pink-800: #701d4c;
--color-fen-hong-pink-900: #4f1334;
--color-fen-hong-pink-950: #340420;
}SCSS
$fen-hong-pink: #ff6cb5;
$fen-hong-pink-rgb: 255, 108, 181;
$fen-hong-pink-light: mix(#fff, $fen-hong-pink, 20%);
$fen-hong-pink-dark: mix(#000, $fen-hong-pink, 20%);
.element {
color: $fen-hong-pink;
box-shadow: 0 0 0 2px rgba($fen-hong-pink, 0.35);
}