핵심 정리
- 밝고 부드러운 색 23가지를 HEX와 RGB로 모았어요. 색을 누르면 HEX 코드가 바로 복사돼요.
- 파스텔톤은 흰색이 많이 섞인 색이에요. HSL로 보면 밝기(L)가 75~98%로 높아요.
- 마음에 드는 진한 색이 있으면 색상코드 변환 칸의 밝게 단계에서 흰색을 섞어 파스텔톤으로 만들 수 있어요.
- 파스텔 바탕에는 검은 글자를 쓰세요. 여기 23가지 모두 검은 글자 명도 대비가 4.5 : 1을 넘어요.
파스텔 색상코드
색 이름은 CSS 이름이고, 한국어 이름은 알아보기 쉽게 붙였어요.
| 색 | HEX | RGB |
|---|---|---|
| 라벤더 (lavender) | #E6E6FA | 230, 230, 250 |
| 엉겅퀴색 (thistle) | #D8BFD8 | 216, 191, 216 |
| 자두색 (plum) | #DDA0DD | 221, 160, 221 |
| 분홍 (pink) | #FFC0CB | 255, 192, 203 |
| 연분홍 (lightpink) | #FFB6C1 | 255, 182, 193 |
| 안개 장미색 (mistyrose) | #FFE4E1 | 255, 228, 225 |
| 복숭아색 (peachpuff) | #FFDAB9 | 255, 218, 185 |
| 비스크 (bisque) | #FFE4C4 | 255, 228, 196 |
| 모카신 (moccasin) | #FFE4B5 | 255, 228, 181 |
| 파파야 휩 (papayawhip) | #FFEFD5 | 255, 239, 213 |
| 레몬 시폰 (lemonchiffon) | #FFFACD | 255, 250, 205 |
| 연노랑 (lightyellow) | #FFFFE0 | 255, 255, 224 |
| 연한 황금색 (palegoldenrod) | #EEE8AA | 238, 232, 170 |
| 허니듀 (honeydew) | #F0FFF0 | 240, 255, 240 |
| 연한 초록 (palegreen) | #98FB98 | 152, 251, 152 |
| 민트 크림 (mintcream) | #F5FFFA | 245, 255, 250 |
| 아쿠아마린 (aquamarine) | #7FFFD4 | 127, 255, 212 |
| 연한 청록 (paleturquoise) | #AFEEEE | 175, 238, 238 |
| 연한 시안 (lightcyan) | #E0FFFF | 224, 255, 255 |
| 파우더 블루 (powderblue) | #B0E0E6 | 176, 224, 230 |
| 연파랑 (lightblue) | #ADD8E6 | 173, 216, 230 |
| 연한 스틸 블루 (lightsteelblue) | #B0C4DE | 176, 196, 222 |
| 앨리스 블루 (aliceblue) | #F0F8FF | 240, 248, 255 |
웹에서는 HEX 코드나 CSS 이름(lavender 등)을 그대로 써도 같은 색이 나와요.
출처
- W3C CSS Color Module Level 4(2026-09-30 판), 6.1 Named Colors: 색 이름과 HEX 값. 7.1 Converting HSL Colors to sRGB: HSL과 RGB 변환식
- W3C WCAG 2.2(2024-12-12 권고), 용어 relative luminance와 contrast ratio, 성공 기준 1.4.3 최소 대비(4.5 : 1, 큰 글자 3 : 1), 1.4.6 향상된 대비(7 : 1)
- 한국형 웹 콘텐츠 접근성 지침 2.2(KS X OT0003:2022), 5.4.3 텍스트 콘텐츠의 명도 대비: 4.5 대 1 이상
2026년 10월 5일에 다시 확인했어요.