色名 · #FCA2AD
Ballet Slippers
Ballet Slippersは#FCA2AD：rgb(252 162 173)、hsl(353 94% 81%)、oklch(0.805 0.107 11.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Ballet Slippers color name →
#FCA2AD
oklch(0.805 0.107 11.8)
カラー変換
- HEX
- #fca2ad
- RGB
- rgb(252 162 173)
- HSL
- hsl(353 94% 81%)
- HWB
- hwb(353 64% 1%)
- OKLCH
- oklch(0.805 0.107 11.8)
- OKLab
- oklab(0.805 0.105 0.022)
- CIE Lab
- lab(76.13 35.25 8.99)
- LCH
- lch(76.13 36.38 14.3)
- CMYK
- cmyk(0% 36% 31% 1%)
ティント · シェード · トーン
ティント
- FDACB5
- FEB5BD
- FFBEC5
- FFC8CD
- FFD1D5
- FFDADE
- FFE3E6
- FFEDEE
- FFF6F7
シェード
- DB8C96
- BB777F
- 9C636A
- 7E4F55
- 623C41
- 472A2D
- 2D191B
- 160A0B
- 030101
トーン
- F09FA8
- E39CA4
- D7989F
- CA959B
- BE9296
- B28E92
- A58B8D
- 998789
- 8D8484
カラーハーモニー
補色 +180°
- FCA2AD
Ballet Slippers
- 5DD5D1
≈ Hidden Sea Glass
類似色 -30° +30°
- FCA2AD
Ballet Slippers
- EFA4D3
≈ Violet Kiss
- FBA888
≈ Citrus Hill
トライアド +120° +240°
- FCA2AD
Ballet Slippers
- A6CE85
≈ Pistachio Dream
- 8FC4FF
≈ Chromis Damsel Blue
スプリットコンプリメンタリー +150° +210°
- FCA2AD
Ballet Slippers
- 7BD5AA
≈ Tadorna Teal
- 66CFF1
≈ Heisenberg Blue
テトラード +90° +180° +270°
- FCA2AD
Ballet Slippers
- CDC26D
≈ Fresh Sprout
- 5DD5D1
≈ Hidden Sea Glass
- B4B8FF
≈ Greyish Lavender
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.92:1 · APCA Lc 37
Ag
AAA黒の上
WCAG 10.91:1 · APCA Lc 66
最適な文字色: #000000
WCAG 10.91:1 (AAA) · APCA Lc 66
Contrast pairs
コードスニペット
CSS
:root {
--ballet-slippers: #fca2ad;
--ballet-slippers-rgb: 252 162 173;
--ballet-slippers-oklch: oklch(0.805 0.107 11.8);
}
.element {
color: var(--ballet-slippers);
background-color: hsl(353 94% 81%);
border-color: oklch(0.805 0.107 11.8);
}Tailwind CSS v4
@theme {
--color-ballet-slippers: #fca2ad;
--color-ballet-slippers-50: #ffe9ec;
--color-ballet-slippers-100: #ffdadd;
--color-ballet-slippers-200: #ffc2c6;
--color-ballet-slippers-300: #e9a1a7;
--color-ballet-slippers-400: #d6838e;
--color-ballet-slippers-500: #c26673;
--color-ballet-slippers-600: #a45762;
--color-ballet-slippers-700: #84454e;
--color-ballet-slippers-800: #62313a;
--color-ballet-slippers-900: #452228;
--color-ballet-slippers-950: #2c1116;
}SCSS
$ballet-slippers: #fca2ad;
$ballet-slippers-rgb: 252, 162, 173;
$ballet-slippers-light: mix(#fff, $ballet-slippers, 20%);
$ballet-slippers-dark: mix(#000, $ballet-slippers, 20%);
.element {
color: $ballet-slippers;
box-shadow: 0 0 0 2px rgba($ballet-slippers, 0.35);
}