이름 색상 · #AEBBD0
Sailor Boy
Sailor Boy은(는) #AEBBD0: rgb(174 187 208), hsl(217 27% 75%), oklch(0.789 0.033 260). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Sailor Boy color name →
#AEBBD0
oklch(0.789 0.033 260)
색상 변환
- HEX
- #aebbd0
- RGB
- rgb(174 187 208)
- HSL
- hsl(217 27% 75%)
- HWB
- hwb(217 68% 18%)
- OKLCH
- oklch(0.789 0.033 260)
- OKLab
- oklab(0.789 -0.006 -0.033)
- CIE Lab
- lab(75.37 -1.4 -12.23)
- LCH
- lch(75.37 12.31 263.5)
- CMYK
- cmyk(16% 10% 0% 18%)
틴트 · 셰이드 · 톤
틴트
- B6C2D5
- BEC8D9
- C6CFDE
- CED6E3
- D6DDE7
- DEE3EC
- E6EAF1
- EEF1F6
- F7F8FA
셰이드
- 97A2B5
- 808A9A
- 6A7380
- 555C67
- 41464F
- 2E3239
- 1C1F23
- 0B0D10
- 010202
톤
- A9B5C8
- A5AFC0
- A0A9B7
- 9BA3AF
- 979DA7
- 92979F
- 8E9197
- 898C90
- 858688
색 조화
보색 +180°
- AEBBD0
Sailor Boy
- C6B8A3
≈ Sandy Toes
유사색 -30° +30°
- AEBBD0
Sailor Boy
- A5BFCC
≈ Sea Breeze
- B9B7CF
≈ Fragile
삼각 배색 +120° +240°
- AEBBD0
Sailor Boy
- CFB2B1
≈ Smoked Lavender
- AFC0AC
≈ Unroasted Coffee
분열 보색 +150° +210°
- AEBBD0
Sailor Boy
- CDB5A8
≈ Sashay Sand
- BBBCA4
≈ Restful
사각 배색 +90° +180° +270°
- AEBBD0
Sailor Boy
- CCB2BD
≈ Candlelight Dinner
- C6B8A3
≈ Sandy Toes
- A6C1B7
≈ Folk Tales
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.94:1 · APCA Lc 37
Ag
AAA검은색 위
WCAG 10.81:1 · APCA Lc 65
가장 좋은 글자색: #000000
WCAG 10.81:1 (AAA) · APCA Lc 65
Contrast pairs
코드 스니펫
CSS
:root {
--sailor-boy: #aebbd0;
--sailor-boy-rgb: 174 187 208;
--sailor-boy-oklch: oklch(0.789 0.033 260);
}
.element {
color: var(--sailor-boy);
background-color: hsl(217 27% 75%);
border-color: oklch(0.789 0.033 260);
}Tailwind CSS v4
@theme {
--color-sailor-boy: #aebbd0;
--color-sailor-boy-50: #f0f5ff;
--color-sailor-boy-100: #e2e8f3;
--color-sailor-boy-200: #cdd5e3;
--color-sailor-boy-300: #aeb8c9;
--color-sailor-boy-400: #939fb3;
--color-sailor-boy-500: #7a879d;
--color-sailor-boy-600: #677284;
--color-sailor-boy-700: #525b6a;
--color-sailor-boy-800: #3b434e;
--color-sailor-boy-900: #292e36;
--color-sailor-boy-950: #171b21;
}SCSS
$sailor-boy: #aebbd0;
$sailor-boy-rgb: 174, 187, 208;
$sailor-boy-light: mix(#fff, $sailor-boy, 20%);
$sailor-boy-dark: mix(#000, $sailor-boy, 20%);
.element {
color: $sailor-boy;
box-shadow: 0 0 0 2px rgba($sailor-boy, 0.35);
}