色名 · #FF66FF
Pink Flamingo
Pink Flamingoは#FF66FF：rgb(255 102 255)、hsl(300 100% 70%)、oklch(0.757 0.251 327.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Pink Flamingo color name →
#FF66FF
oklch(0.757 0.251 327.7)
カラー変換
- HEX
- #ff66ff
- RGB
- rgb(255 102 255)
- HSL
- hsl(300 100% 70%)
- HWB
- hwb(300 40% 0%)
- OKLCH
- oklch(0.757 0.251 327.7)
- OKLab
- oklab(0.757 0.212 -0.134)
- CIE Lab
- lab(67.9 72.29 -48.3)
- LCH
- lch(67.9 86.94 326.3)
- CMYK
- cmyk(0% 60% 0% 0%)
ティント · シェード · トーン
ティント
- FF79FF
- FF8BFF
- FF9BFF
- FFAAFF
- FFB9FF
- FFC8FF
- FFD6FF
- FFE4FF
- FFF1FF
シェード
- DE58DE
- BE4ABE
- 9E3C9E
- 802F80
- 632363
- 481748
- 2E0C2E
- 160416
- 030003
トーン
- F36CF2
- E671E5
- DA75D8
- CD78CC
- C17BBF
- B47DB2
- A87EA6
- 9B7F99
- 8D808D
カラーハーモニー
補色 +180°
- FF66FF
Pink Flamingo
- 00D354
≈ Brazilianite
類似色 -30° +30°
- FF66FF
Pink Flamingo
- BB9BFF
≈ Baby Purple
- FF80B0
≈ Erythrosine
トライアド +120° +240°
- FF66FF
Pink Flamingo
- D9A800
≈ Cabana Glow
- 00C6DA
≈ The Crowd Roars!
スプリットコンプリメンタリー +150° +210°
- FF66FF
Pink Flamingo
- A8BD00
≈ Yew
- 00CCAF
≈ Mint Leaf
テトラード +90° +180° +270°
- FF66FF
Pink Flamingo
- FF8F21
≈ Laddu Orange
- 00D354
≈ Brazilianite
- 43BCFF
≈ Glitter Lake
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.44:1 · APCA Lc 47
Ag
AAA黒の上
WCAG 8.59:1 · APCA Lc 55
最適な文字色: #000000
WCAG 8.59:1 (AAA) · APCA Lc 55
Contrast pairs
コードスニペット
CSS
:root {
--pink-flamingo: #ff66ff;
--pink-flamingo-rgb: 255 102 255;
--pink-flamingo-oklch: oklch(0.757 0.251 327.7);
}
.element {
color: var(--pink-flamingo);
background-color: hsl(300 100% 70%);
border-color: oklch(0.757 0.251 327.7);
}Tailwind CSS v4
@theme {
--color-pink-flamingo: #ff66ff;
--color-pink-flamingo-50: #ffdcff;
--color-pink-flamingo-100: #ffc9ff;
--color-pink-flamingo-200: #ffabff;
--color-pink-flamingo-300: #fc81f4;
--color-pink-flamingo-400: #e858e8;
--color-pink-flamingo-500: #d518d8;
--color-pink-flamingo-600: #b41bb6;
--color-pink-flamingo-700: #911792;
--color-pink-flamingo-800: #6a0f6f;
--color-pink-flamingo-900: #4b0a4f;
--color-pink-flamingo-950: #310034;
}SCSS
$pink-flamingo: #ff66ff;
$pink-flamingo-rgb: 255, 102, 255;
$pink-flamingo-light: mix(#fff, $pink-flamingo, 20%);
$pink-flamingo-dark: mix(#000, $pink-flamingo, 20%);
.element {
color: $pink-flamingo;
box-shadow: 0 0 0 2px rgba($pink-flamingo, 0.35);
}