色名 · #FFBCD9
Cotton Candy
Cotton Candyは#FFBCD9：rgb(255 188 217)、hsl(334 100% 87%)、oklch(0.865 0.085 351.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Cotton Candy color name →
#FFBCD9
oklch(0.865 0.085 351.3)
カラー変換
- HEX
- #ffbcd9
- RGB
- rgb(255 188 217)
- HSL
- hsl(334 100% 87%)
- HWB
- hwb(334 74% 0%)
- OKLCH
- oklch(0.865 0.085 351.3)
- OKLab
- oklab(0.865 0.084 -0.013)
- CIE Lab
- lab(83.18 27.98 -4.57)
- LCH
- lch(83.18 28.35 350.7)
- CMYK
- cmyk(0% 26% 15% 0%)
ティント · シェード · トーン
ティント
- FFC3DD
- FFCAE1
- FFD0E4
- FFD7E8
- FFDEEC
- FFE4F0
- FFEBF4
- FFF2F7
- FFF8FB
シェード
- DEA3BC
- BE8BA1
- 9E7386
- 805D6C
- 634753
- 48323B
- 2E1F25
- 160D11
- 030202
トーン
- F2B6D0
- E5B0C7
- D8AABD
- CBA4B4
- BF9EAB
- B298A3
- A5929A
- 998C91
- 8C8689
カラーハーモニー
補色 +180°
- FFBCD9
Cotton Candy
- 98E5CB
≈ Aqua Wish
類似色 -30° +30°
- FFBCD9
Cotton Candy
- EDC1F5
≈ Purple’s Baby Sister
- FFC0BE
≈ Ladylike
トライアド +120° +240°
- FFBCD9
Cotton Candy
- D4D897
≈ Mellow Green
- 9BDDFF
≈ Columbia Blue
スプリットコンプリメンタリー +150° +210°
- FFBCD9
Cotton Candy
- B4E1AD
≈ Mint Cocktail Green
- 8CE4EA
≈ Aqua Fiesta
テトラード +90° +180° +270°
- FFBCD9
Cotton Candy
- EFCD92
≈ Sunlight
- 98E5CB
≈ Aqua Wish
- BBD4FF
≈ Ice Cold Stare
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.56:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.44:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.44:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--cotton-candy: #ffbcd9;
--cotton-candy-rgb: 255 188 217;
--cotton-candy-oklch: oklch(0.865 0.085 351.3);
}
.element {
color: var(--cotton-candy);
background-color: hsl(334 100% 87%);
border-color: oklch(0.865 0.085 351.3);
}Tailwind CSS v4
@theme {
--color-cotton-candy: #ffbcd9;
--color-cotton-candy-50: #ffecf7;
--color-cotton-candy-100: #ffddea;
--color-cotton-candy-200: #f3c6d7;
--color-cotton-candy-300: #dba6bb;
--color-cotton-candy-400: #c68aa4;
--color-cotton-candy-500: #b16e8d;
--color-cotton-candy-600: #965d77;
--color-cotton-candy-700: #784b5f;
--color-cotton-candy-800: #593647;
--color-cotton-candy-900: #3e2531;
--color-cotton-candy-950: #27131d;
}SCSS
$cotton-candy: #ffbcd9;
$cotton-candy-rgb: 255, 188, 217;
$cotton-candy-light: mix(#fff, $cotton-candy, 20%);
$cotton-candy-dark: mix(#000, $cotton-candy, 20%);
.element {
color: $cotton-candy;
box-shadow: 0 0 0 2px rgba($cotton-candy, 0.35);
}