이름 색상 · #658DC6
Provence
Provence은(는) #658DC6: rgb(101 141 198), hsl(215 46% 59%), oklch(0.638 0.097 257.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Provence color name →
#658DC6
oklch(0.638 0.097 257.3)
색상 변환
- HEX
- #658dc6
- RGB
- rgb(101 141 198)
- HSL
- hsl(215 46% 59%)
- HWB
- hwb(215 40% 22%)
- OKLCH
- oklch(0.638 0.097 257.3)
- OKLab
- oklab(0.638 -0.021 -0.095)
- CIE Lab
- lab(57.48 -2.14 -34.38)
- LCH
- lch(57.48 34.45 266.4)
- CMYK
- cmyk(49% 29% 0% 22%)
틴트 · 셰이드 · 톤
틴트
- 7498CC
- 83A3D2
- 92AFD8
- A1BADE
- B0C5E4
- C0D1E9
- CFDCEF
- DFE8F4
- EFF3FA
셰이드
- 577AAC
- 496792
- 3C557A
- 2F4462
- 22334B
- 172335
- 0C1421
- 03070E
- 000102
톤
- 688CBF
- 6B8BB8
- 6E8AB1
- 7188AA
- 7387A3
- 76869C
- 798595
- 7B838E
- 7E8287
색 조화
보색 +180°
- 658DC6
Provence
- AC8342
≈ Walnut Shell
유사색 -30° +30°
- 658DC6
Provence
- 4097B9
≈ Coastline Blue
- 8882C3
≈ Faraway Sky
삼각 배색 +120° +240°
- 658DC6
Provence
- BF7276
≈ Brandied Apricot
- 6F995E
≈ Meadow Green
분열 보색 +150° +210°
- 658DC6
Provence
- BC7957
≈ Moroccan Sky
- 929045
≈ April Hills
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 3.39:1 · APCA Lc 61
Ag
AA검은색 위
WCAG 6.17:1 · APCA Lc 40
가장 좋은 글자색: #000000
WCAG 6.17:1 (AA) · APCA Lc 40
Contrast pairs
코드 스니펫
CSS
:root {
--provence: #658dc6;
--provence-rgb: 101 141 198;
--provence-oklch: oklch(0.638 0.097 257.3);
}
.element {
color: var(--provence);
background-color: hsl(215 46% 59%);
border-color: oklch(0.638 0.097 257.3);
}Tailwind CSS v4
@theme {
--color-provence: #658dc6;
--color-provence-50: #e5f6ff;
--color-provence-100: #d5e9ff;
--color-provence-200: #bcd6fe;
--color-provence-300: #9ab9ea;
--color-provence-400: #7aa0d8;
--color-provence-500: #5c87c6;
--color-provence-600: #4e73a7;
--color-provence-700: #3e5c86;
--color-provence-800: #2b4363;
--color-provence-900: #1d2f46;
--color-provence-950: #0d1b2d;
}SCSS
$provence: #658dc6;
$provence-rgb: 101, 141, 198;
$provence-light: mix(#fff, $provence, 20%);
$provence-dark: mix(#000, $provence, 20%);
.element {
color: $provence;
box-shadow: 0 0 0 2px rgba($provence, 0.35);
}