이름 색상 · #A3B1F2
Wondrous Wisteria
Wondrous Wisteria은(는) #A3B1F2: rgb(163 177 242), hsl(229 75% 79%), oklch(0.774 0.094 274.6). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Wondrous Wisteria color name →
#A3B1F2
oklch(0.774 0.094 274.6)
색상 변환
- HEX
- #a3b1f2
- RGB
- rgb(163 177 242)
- HSL
- hsl(229 75% 79%)
- HWB
- hwb(229 64% 5%)
- OKLCH
- oklch(0.774 0.094 274.6)
- OKLab
- oklab(0.774 0.008 -0.094)
- CIE Lab
- lab(72.92 6.27 -34.36)
- LCH
- lch(72.92 34.93 280.3)
- CMYK
- cmyk(33% 27% 0% 5%)
틴트 · 셰이드 · 톤
틴트
- ACB9F4
- B5C1F5
- BEC8F7
- C7D0F8
- D0D8FA
- D9E0FB
- E2E8FC
- ECEFFD
- F5F7FE
셰이드
- 8D99D2
- 7883B4
- 636C96
- 4F5779
- 3C425E
- 2A2F43
- 191C2B
- 0A0C14
- 010103
톤
- 9FACE6
- 9CA7DB
- 98A2CF
- 959EC4
- 9199B8
- 8E94AD
- 8A8FA2
- 878A96
- 83858B
색 조화
보색 +180°
- A3B1F2
Wondrous Wisteria
- C8B56D
≈ Canadian Maple
유사색 -30° +30°
- A3B1F2
Wondrous Wisteria
- 81BCEE
≈ Electric Eel
- C3A6E6
≈ Silver Rust
삼각 배색 +120° +240°
- A3B1F2
Wondrous Wisteria
- EBA08D
≈ Tonys Pink
- 84C79B
≈ Foul Green
분열 보색 +150° +210°
- A3B1F2
Wondrous Wisteria
- E0A974
≈ Sweet Cashew
- A8C07D
≈ Margarita
사각 배색 +90° +180° +270°
- A3B1F2
Wondrous Wisteria
- E99CAE
≈ Second Blush
- C8B56D
≈ Canadian Maple
- 67C9BD
≈ Bayside
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.07:1 · APCA Lc 40
Ag
AAA검은색 위
WCAG 10.12:1 · APCA Lc 62
가장 좋은 글자색: #000000
WCAG 10.12:1 (AAA) · APCA Lc 62
Contrast pairs
코드 스니펫
CSS
:root {
--wondrous-wisteria: #a3b1f2;
--wondrous-wisteria-rgb: 163 177 242;
--wondrous-wisteria-oklch: oklch(0.774 0.094 274.6);
}
.element {
color: var(--wondrous-wisteria);
background-color: hsl(229 75% 79%);
border-color: oklch(0.774 0.094 274.6);
}Tailwind CSS v4
@theme {
--color-wondrous-wisteria: #a3b1f2;
--color-wondrous-wisteria-50: #eef3ff;
--color-wondrous-wisteria-100: #dfe6ff;
--color-wondrous-wisteria-200: #c9d1fd;
--color-wondrous-wisteria-300: #aab4e8;
--color-wondrous-wisteria-400: #8d9ad7;
--color-wondrous-wisteria-500: #7481c5;
--color-wondrous-wisteria-600: #626da6;
--color-wondrous-wisteria-700: #4e5785;
--color-wondrous-wisteria-800: #374063;
--color-wondrous-wisteria-900: #262c46;
--color-wondrous-wisteria-950: #14192d;
}SCSS
$wondrous-wisteria: #a3b1f2;
$wondrous-wisteria-rgb: 163, 177, 242;
$wondrous-wisteria-light: mix(#fff, $wondrous-wisteria, 20%);
$wondrous-wisteria-dark: mix(#000, $wondrous-wisteria, 20%);
.element {
color: $wondrous-wisteria;
box-shadow: 0 0 0 2px rgba($wondrous-wisteria, 0.35);
}