色名 · #FBCCE7
Classic Rose
Classic Roseは#FBCCE7：rgb(251 204 231)、hsl(326 85% 89%)、oklch(0.894 0.063 343)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Classic Rose color name →
#FBCCE7
oklch(0.894 0.063 343)
カラー変換
- HEX
- #fbcce7
- RGB
- rgb(251 204 231)
- HSL
- hsl(326 85% 89%)
- HWB
- hwb(326 80% 2%)
- OKLCH
- oklch(0.894 0.063 343)
- OKLab
- oklab(0.894 0.06 -0.018)
- CIE Lab
- lab(86.8 20.29 -6.78)
- LCH
- lch(86.8 21.39 341.5)
- CMYK
- cmyk(0% 19% 8% 2%)
ティント · シェード · トーン
ティント
- FCD1E9
- FCD6EC
- FDDBEE
- FDE0F1
- FEE6F3
- FEEBF5
- FEF0F8
- FFF5FA
- FFFAFD
シェード
- DAB1C9
- BA97AB
- 9C7E8F
- 7E6573
- 614E59
- 463740
- 2D2228
- 150F13
- 030203
トーン
- EEC4DC
- E2BCD2
- D5B5C7
- C8ADBD
- BCA5B2
- B09EA8
- A4969E
- 988F94
- 8C878A
カラーハーモニー
補色 +180°
- FBCCE7
Classic Rose
- B7EAD0
≈ Woolly Mint
類似色 -30° +30°
- FBCCE7
Classic Rose
- EBD0FA
≈ Mousse aux Pruneaux
- FFCDD1
≈ Lusty-Gallant
トライアド +120° +240°
- FBCCE7
Classic Rose
- E3DEAE
≈ Virgin Olive Oil
- AFE6FB
≈ Frozen Landscape
スプリットコンプリメンタリー +150° +210°
- FBCCE7
Classic Rose
- CCE6BB
≈ Iced Avocado
- ABEAE7
≈ Spearmint Water
テトラード +90° +180° +270°
- FBCCE7
Classic Rose
- F6D6AE
≈ Apricot Gelato
- B7EAD0
≈ Woolly Mint
- C4DFFF
≈ Dithered Sky
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.41:1 · APCA Lc 20
Ag
AAA黒の上
WCAG 14.89:1 · APCA Lc 84
最適な文字色: #000000
WCAG 14.89:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--classic-rose: #fbcce7;
--classic-rose-rgb: 251 204 231;
--classic-rose-oklch: oklch(0.894 0.063 343);
}
.element {
color: var(--classic-rose);
background-color: hsl(326 85% 89%);
border-color: oklch(0.894 0.063 343);
}Tailwind CSS v4
@theme {
--color-classic-rose: #fbcce7;
--color-classic-rose-50: #ffeef9;
--color-classic-rose-100: #f8e0ed;
--color-classic-rose-200: #e9cada;
--color-classic-rose-300: #d0abbf;
--color-classic-rose-400: #ba90a8;
--color-classic-rose-500: #a47691;
--color-classic-rose-600: #8b647b;
--color-classic-rose-700: #6f5062;
--color-classic-rose-800: #523a49;
--color-classic-rose-900: #392833;
--color-classic-rose-950: #23161e;
}SCSS
$classic-rose: #fbcce7;
$classic-rose-rgb: 251, 204, 231;
$classic-rose-light: mix(#fff, $classic-rose, 20%);
$classic-rose-dark: mix(#000, $classic-rose, 20%);
.element {
color: $classic-rose;
box-shadow: 0 0 0 2px rgba($classic-rose, 0.35);
}