이름 색상 · #638F7B
Sheffield
Sheffield은(는) #638F7B: rgb(99 143 123), hsl(153 18% 47%), oklch(0.612 0.057 164.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Green mean? → · Sheffield color name →
#638F7B
oklch(0.612 0.057 164.7)
색상 변환
- HEX
- #638f7b
- RGB
- rgb(99 143 123)
- HSL
- hsl(153 18% 47%)
- HWB
- hwb(153 39% 44%)
- OKLCH
- oklch(0.612 0.057 164.7)
- OKLab
- oklab(0.612 -0.055 0.015)
- CIE Lab
- lab(55.75 -19.08 5.62)
- LCH
- lch(55.75 19.89 163.6)
- CMYK
- cmyk(31% 0% 14% 44%)
틴트 · 셰이드 · 톤
틴트
- 729A87
- 81A594
- 91B0A1
- A0BBAE
- B0C6BB
- BFD1C8
- CFDCD6
- DFE8E3
- EFF3F1
셰이드
- 557C6A
- 47695A
- 3A574A
- 2E453A
- 21342C
- 16241E
- 0B1510
- 030705
- 000101
톤
- 668E7C
- 6A8C7C
- 6D8B7D
- 70897D
- 73887E
- 76867E
- 78857F
- 7B837F
- 7E8280
색 조화
보색 +180°
- 638F7B
Sheffield
- 9D768C
≈ Upper Crust
유사색 -30° +30°
- 638F7B
Sheffield
- 758C69
≈ Watercress Spice
- 598F8E
≈ Bristol Blue
삼각 배색 +120° +240°
- 638F7B
Sheffield
- 7F7FA5
≈ Roseine Plum
- A27968
≈ Woodhaven
분열 보색 +150° +210°
- 638F7B
Sheffield
- 917A9C
≈ Vestige
- A37679
≈ Handmade Red
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 3.65:1 · APCA Lc 64
Ag
AA검은색 위
WCAG 5.74:1 · APCA Lc 38
가장 좋은 글자색: #000000
WCAG 5.74:1 (AA) · APCA Lc 38
Contrast pairs
코드 스니펫
CSS
:root {
--sheffield: #638f7b;
--sheffield-rgb: 99 143 123;
--sheffield-oklch: oklch(0.612 0.057 164.7);
}
.element {
color: var(--sheffield);
background-color: hsl(153 18% 47%);
border-color: oklch(0.612 0.057 164.7);
}Tailwind CSS v4
@theme {
--color-sheffield: #638f7b;
--color-sheffield-50: #e7fbf2;
--color-sheffield-100: #d7eee4;
--color-sheffield-200: #beddcf;
--color-sheffield-300: #9cc1b1;
--color-sheffield-400: #7faa96;
--color-sheffield-500: #61937c;
--color-sheffield-600: #537c69;
--color-sheffield-700: #426354;
--color-sheffield-800: #30493d;
--color-sheffield-900: #20322a;
--color-sheffield-950: #101e17;
}SCSS
$sheffield: #638f7b;
$sheffield-rgb: 99, 143, 123;
$sheffield-light: mix(#fff, $sheffield, 20%);
$sheffield-dark: mix(#000, $sheffield, 20%);
.element {
color: $sheffield;
box-shadow: 0 0 0 2px rgba($sheffield, 0.35);
}