色名 · #D5BCC2
Frosted Sugar
Frosted Sugarは#D5BCC2：rgb(213 188 194)、hsl(346 23% 79%)、oklch(0.818 0.03 1.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Frosted Sugar color name →
#D5BCC2
oklch(0.818 0.03 1.5)
カラー変換
- HEX
- #d5bcc2
- RGB
- rgb(213 188 194)
- HSL
- hsl(346 23% 79%)
- HWB
- hwb(346 74% 16%)
- OKLCH
- oklch(0.818 0.03 1.5)
- OKLab
- oklab(0.818 0.03 0.001)
- CIE Lab
- lab(78.54 9.93 0.4)
- LCH
- lch(78.54 9.94 2.3)
- CMYK
- cmyk(0% 12% 9% 16%)
ティント · シェード · トーン
ティント
- D9C3C8
- DDC9CE
- E2D0D4
- E6D6DA
- EADDE0
- EEE4E6
- F2EBEC
- F7F1F3
- FBF8F9
シェード
- B9A3A8
- 9E8B8F
- 837377
- 6A5D60
- 514749
- 3A3234
- 241F20
- 100D0E
- 020202
トーン
- CCB6BB
- C3B0B4
- BBAAAE
- B2A4A7
- AA9EA0
- A1989A
- 999293
- 908C8D
- 888686
カラーハーモニー
補色 +180°
- D5BCC2
Frosted Sugar
- B0CAC5
≈ Seaport Steam
類似色 -30° +30°
- D5BCC2
Frosted Sugar
- CFBDCC
≈ Tamed Beauty
- D6BDB8
≈ Rose Yoghurt
トライアド +120° +240°
- D5BCC2
Frosted Sugar
- C0C7B2
≈ Haggis
- B3C6D5
≈ Cloudy Valley
スプリットコンプリメンタリー +150° +210°
- D5BCC2
Frosted Sugar
- B6C9BA
≈ Pond’s Edge
- AFC9CF
≈ Floating Blue
テトラード +90° +180° +270°
- D5BCC2
Frosted Sugar
- CAC3AE
≈ Tuft
- B0CAC5
≈ Seaport Steam
- BCC3D7
≈ Candela
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.77:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.80:1 · APCA Lc 70
最適な文字色: #000000
WCAG 11.80:1 (AAA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--frosted-sugar: #d5bcc2;
--frosted-sugar-rgb: 213 188 194;
--frosted-sugar-oklch: oklch(0.818 0.03 1.5);
}
.element {
color: var(--frosted-sugar);
background-color: hsl(346 23% 79%);
border-color: oklch(0.818 0.03 1.5);
}Tailwind CSS v4
@theme {
--color-frosted-sugar: #d5bcc2;
--color-frosted-sugar-50: #fdf2f4;
--color-frosted-sugar-100: #f1e4e7;
--color-frosted-sugar-200: #e0cfd3;
--color-frosted-sugar-300: #c5b1b6;
--color-frosted-sugar-400: #ae989d;
--color-frosted-sugar-500: #987e85;
--color-frosted-sugar-600: #806b70;
--color-frosted-sugar-700: #67565a;
--color-frosted-sugar-800: #4b3e42;
--color-frosted-sugar-900: #342b2d;
--color-frosted-sugar-950: #20181a;
}SCSS
$frosted-sugar: #d5bcc2;
$frosted-sugar-rgb: 213, 188, 194;
$frosted-sugar-light: mix(#fff, $frosted-sugar, 20%);
$frosted-sugar-dark: mix(#000, $frosted-sugar, 20%);
.element {
color: $frosted-sugar;
box-shadow: 0 0 0 2px rgba($frosted-sugar, 0.35);
}