色名 · #FF01CD
Fuchsia Flame
Fuchsia Flameは#FF01CD：rgb(255 1 205)、hsl(312 100% 50%)、oklch(0.675 0.293 340.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Fuchsia Flame color name →
#FF01CD
oklch(0.675 0.293 340.1)
カラー変換
- HEX
- #ff01cd
- RGB
- rgb(255 1 205)
- HSL
- hsl(312 100% 50%)
- HWB
- hwb(312 0% 0%)
- OKLCH
- oklch(0.675 0.293 340.1)
- OKLab
- oklab(0.675 0.275 -0.1)
- CIE Lab
- lab(58.01 88.88 -35.79)
- LCH
- lch(58.01 95.82 338.1)
- CMYK
- cmyk(0% 100% 20% 0%)
ティント · シェード · トーン
ティント
- FF42D3
- FF60D8
- FF78DD
- FF8EE2
- FFA2E7
- FFB6EC
- FFC9F1
- FFDBF6
- FFEDFB
シェード
- DE01B2
- BE0198
- 9E007E
- 800066
- 63004E
- 480038
- 2E0023
- 16000F
- 030002
トーン
- F430C5
- E843BE
- DC51B6
- D05BAF
- C464A7
- B86B9F
- AB7297
- 9D7790
- 8F7C88
カラーハーモニー
補色 +180°
- FF01CD
Fuchsia Flame
- 00B276
≈ Green Teal
類似色 -30° +30°
- FF01CD
Fuchsia Flame
- C260FF
≈ Jacaranda Pink
- FF4777
≈ Sasquatch Socks
トライアド +120° +240°
- FF01CD
Fuchsia Flame
- AB9800
≈ Nuclear Fallout
- 00A7CB
≈ Gummy Dolphins
スプリットコンプリメンタリー +150° +210°
- FF01CD
Fuchsia Flame
- 70AB00
≈ Green Envy
- 00ADA7
≈ Teal Me No Lies
テトラード +90° +180° +270°
- FF01CD
Fuchsia Flame
- CF8400
≈ Copious Caramel
- 00B276
≈ Green Teal
- 239AFF
≈ Blue Nebula
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.42:1 · APCA Lc 59
Ag
AA黒の上
WCAG 6.13:1 · APCA Lc 43
最適な文字色: #000000
WCAG 6.13:1 (AA) · APCA Lc 43
Contrast pairs
コードスニペット
CSS
:root {
--fuchsia-flame: #ff01cd;
--fuchsia-flame-rgb: 255 1 205;
--fuchsia-flame-oklch: oklch(0.675 0.293 340.1);
}
.element {
color: var(--fuchsia-flame);
background-color: hsl(312 100% 50%);
border-color: oklch(0.675 0.293 340.1);
}Tailwind CSS v4
@theme {
--color-fuchsia-flame: #ff01cd;
--color-fuchsia-flame-50: #ffd4ff;
--color-fuchsia-flame-100: #ffc0ff;
--color-fuchsia-flame-200: #ff9df7;
--color-fuchsia-flame-300: #ff6de0;
--color-fuchsia-flame-400: #ff32d3;
--color-fuchsia-flame-500: #f300c0;
--color-fuchsia-flame-600: #cd00a2;
--color-fuchsia-flame-700: #a50082;
--color-fuchsia-flame-800: #7a0064;
--color-fuchsia-flame-900: #560046;
--color-fuchsia-flame-950: #3a002e;
}SCSS
$fuchsia-flame: #ff01cd;
$fuchsia-flame-rgb: 255, 1, 205;
$fuchsia-flame-light: mix(#fff, $fuchsia-flame, 20%);
$fuchsia-flame-dark: mix(#000, $fuchsia-flame, 20%);
.element {
color: $fuchsia-flame;
box-shadow: 0 0 0 2px rgba($fuchsia-flame, 0.35);
}