이름 색상 · #C3CDE6
Periwinkle Grey
Periwinkle Grey은(는) #C3CDE6: rgb(195 205 230), hsl(223 41% 83%), oklch(0.849 0.037 268.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Periwinkle Grey color name →
#C3CDE6
oklch(0.849 0.037 268.2)
색상 변환
- HEX
- #c3cde6
- RGB
- rgb(195 205 230)
- HSL
- hsl(223 41% 83%)
- HWB
- hwb(223 76% 10%)
- OKLCH
- oklch(0.849 0.037 268.2)
- OKLab
- oklab(0.849 -0.001 -0.036)
- CIE Lab
- lab(82.22 0.23 -13.64)
- LCH
- lch(82.22 13.64 271)
- CMYK
- cmyk(15% 11% 0% 10%)
틴트 · 셰이드 · 톤
틴트
- C9D2E9
- CFD7EB
- D5DCEE
- DBE1F0
- E1E6F3
- E7EBF5
- EDF0F8
- F3F5FA
- F9FAFD
셰이드
- A9B2C8
- 9098AB
- 787E8E
- 606673
- 4A4E59
- 343840
- 202328
- 0E0F13
- 020203
톤
- BCC5DB
- B5BDD1
- AEB5C6
- A8ADBC
- A1A6B2
- 9A9EA8
- 94969E
- 8D8F94
- 86878A
색 조화
보색 +180°
- C3CDE6
Periwinkle Grey
- D7CCB3
≈ Vanderbilt Beach
유사색 -30° +30°
- C3CDE6
Periwinkle Grey
- B8D1E3
≈ Delicate Ice
- D0C9E3
≈ Light Mulberry
삼각 배색 +120° +240°
- C3CDE6
Periwinkle Grey
- E4C5C0
≈ Rose Coloured Glasses
- BED4C0
≈ Garden Statue
분열 보색 +150° +210°
- C3CDE6
Periwinkle Grey
- E0C8B6
≈ Ellen
- CBD1B6
≈ Sweet Surrender
사각 배색 +90° +180° +270°
- C3CDE6
Periwinkle Grey
- E2C4CD
≈ In the Slip
- D7CCB3
≈ Vanderbilt Beach
- B5D6CD
≈ Gemini
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.59:1 · APCA Lc 27
Ag
AAA검은색 위
WCAG 13.19:1 · APCA Lc 76
가장 좋은 글자색: #000000
WCAG 13.19:1 (AAA) · APCA Lc 76
Contrast pairs
코드 스니펫
CSS
:root {
--periwinkle-grey: #c3cde6;
--periwinkle-grey-rgb: 195 205 230;
--periwinkle-grey-oklch: oklch(0.849 0.037 268.2);
}
.element {
color: var(--periwinkle-grey);
background-color: hsl(223 41% 83%);
border-color: oklch(0.849 0.037 268.2);
}Tailwind CSS v4
@theme {
--color-periwinkle-grey: #c3cde6;
--color-periwinkle-grey-50: #f1f5ff;
--color-periwinkle-grey-100: #e3e8f5;
--color-periwinkle-grey-200: #ced4e4;
--color-periwinkle-grey-300: #b0b7cb;
--color-periwinkle-grey-400: #959eb5;
--color-periwinkle-grey-500: #7c869f;
--color-periwinkle-grey-600: #697186;
--color-periwinkle-grey-700: #545b6c;
--color-periwinkle-grey-800: #3c424f;
--color-periwinkle-grey-900: #292e37;
--color-periwinkle-grey-950: #171b22;
}SCSS
$periwinkle-grey: #c3cde6;
$periwinkle-grey-rgb: 195, 205, 230;
$periwinkle-grey-light: mix(#fff, $periwinkle-grey, 20%);
$periwinkle-grey-dark: mix(#000, $periwinkle-grey, 20%);
.element {
color: $periwinkle-grey;
box-shadow: 0 0 0 2px rgba($periwinkle-grey, 0.35);
}