JUNI COLOR TEST 오늘, 조금 더 나를 알아가는 시간

COLOR DICTIONARY

마음에 드는 색,
이름을 알아볼까요?

눈길이 머무는 색을 골라 보세요.
색의 이름부터 작은 코드 하나까지, 가까이 들여다보는 컬러 사전.

86 COLORS · 색 이름과 코드

색 이름 모아보기

86개의 색

색을 펼치면 자세한 코드가 보여요.

크림슨Crimson#DC143C

빨강 계열 · CSS 색 이름

HEX
#DC143C
RGB
rgb(220, 20, 60)
HSL
hsl(348, 83%, 47%)
이 색으로 배색 만들기 →
파이어브릭FireBrick#B22222

빨강 계열 · CSS 색 이름

HEX
#B22222
RGB
rgb(178, 34, 34)
HSL
hsl(0, 68%, 42%)
이 색으로 배색 만들기 →
다크 레드DarkRed#8B0000

빨강 계열 · CSS 색 이름

HEX
#8B0000
RGB
rgb(139, 0, 0)
HSL
hsl(0, 100%, 27%)
이 색으로 배색 만들기 →
레드Red#FF0000

빨강 계열 · CSS 색 이름

HEX
#FF0000
RGB
rgb(255, 0, 0)
HSL
hsl(0, 100%, 50%)
이 색으로 배색 만들기 →
인디언 레드IndianRed#CD5C5C

빨강 계열 · CSS 색 이름

HEX
#CD5C5C
RGB
rgb(205, 92, 92)
HSL
hsl(0, 53%, 58%)
이 색으로 배색 만들기 →
라이트 코럴LightCoral#F08080

빨강 계열 · CSS 색 이름

HEX
#F08080
RGB
rgb(240, 128, 128)
HSL
hsl(0, 79%, 72%)
이 색으로 배색 만들기 →
새먼Salmon#FA8072

빨강 계열 · CSS 색 이름

HEX
#FA8072
RGB
rgb(250, 128, 114)
HSL
hsl(6, 93%, 71%)
이 색으로 배색 만들기 →
다크 새먼DarkSalmon#E9967A

빨강 계열 · CSS 색 이름

HEX
#E9967A
RGB
rgb(233, 150, 122)
HSL
hsl(15, 72%, 70%)
이 색으로 배색 만들기 →
코럴Coral#FF7F50

주황 계열 · CSS 색 이름

HEX
#FF7F50
RGB
rgb(255, 127, 80)
HSL
hsl(16, 100%, 66%)
이 색으로 배색 만들기 →
토마토Tomato#FF6347

주황 계열 · CSS 색 이름

HEX
#FF6347
RGB
rgb(255, 99, 71)
HSL
hsl(9, 100%, 64%)
이 색으로 배색 만들기 →
오렌지 레드OrangeRed#FF4500

주황 계열 · CSS 색 이름

HEX
#FF4500
RGB
rgb(255, 69, 0)
HSL
hsl(16, 100%, 50%)
이 색으로 배색 만들기 →
다크 오렌지DarkOrange#FF8C00

주황 계열 · CSS 색 이름

HEX
#FF8C00
RGB
rgb(255, 140, 0)
HSL
hsl(33, 100%, 50%)
이 색으로 배색 만들기 →
오렌지Orange#FFA500

주황 계열 · CSS 색 이름

HEX
#FFA500
RGB
rgb(255, 165, 0)
HSL
hsl(39, 100%, 50%)
이 색으로 배색 만들기 →
피치 퍼프PeachPuff#FFDAB9

주황 계열 · CSS 색 이름

HEX
#FFDAB9
RGB
rgb(255, 218, 185)
HSL
hsl(28, 100%, 86%)
이 색으로 배색 만들기 →
골드Gold#FFD700

노랑 계열 · CSS 색 이름

HEX
#FFD700
RGB
rgb(255, 215, 0)
HSL
hsl(51, 100%, 50%)
이 색으로 배색 만들기 →
골든로드Goldenrod#DAA520

노랑 계열 · CSS 색 이름

HEX
#DAA520
RGB
rgb(218, 165, 32)
HSL
hsl(43, 74%, 49%)
이 색으로 배색 만들기 →
카키Khaki#F0E68C

노랑 계열 · CSS 색 이름

HEX
#F0E68C
RGB
rgb(240, 230, 140)
HSL
hsl(54, 77%, 75%)
이 색으로 배색 만들기 →
다크 카키DarkKhaki#BDB76B

노랑 계열 · CSS 색 이름

HEX
#BDB76B
RGB
rgb(189, 183, 107)
HSL
hsl(56, 38%, 58%)
이 색으로 배색 만들기 →
옐로Yellow#FFFF00

노랑 계열 · CSS 색 이름

HEX
#FFFF00
RGB
rgb(255, 255, 0)
HSL
hsl(60, 100%, 50%)
이 색으로 배색 만들기 →
라이트 옐로LightYellow#FFFFE0

노랑 계열 · CSS 색 이름

HEX
#FFFFE0
RGB
rgb(255, 255, 224)
HSL
hsl(60, 100%, 94%)
이 색으로 배색 만들기 →
레몬 시폰LemonChiffon#FFFACD

노랑 계열 · CSS 색 이름

HEX
#FFFACD
RGB
rgb(255, 250, 205)
HSL
hsl(54, 100%, 90%)
이 색으로 배색 만들기 →
페일 골든로드PaleGoldenrod#EEE8AA

노랑 계열 · CSS 색 이름

HEX
#EEE8AA
RGB
rgb(238, 232, 170)
HSL
hsl(55, 67%, 80%)
이 색으로 배색 만들기 →
올리브Olive#808000

초록 계열 · CSS 색 이름

HEX
#808000
RGB
rgb(128, 128, 0)
HSL
hsl(60, 100%, 25%)
이 색으로 배색 만들기 →
올리브 드래브OliveDrab#6B8E23

초록 계열 · CSS 색 이름

HEX
#6B8E23
RGB
rgb(107, 142, 35)
HSL
hsl(80, 60%, 35%)
이 색으로 배색 만들기 →
옐로 그린YellowGreen#9ACD32

초록 계열 · CSS 색 이름

HEX
#9ACD32
RGB
rgb(154, 205, 50)
HSL
hsl(80, 61%, 50%)
이 색으로 배색 만들기 →
론 그린LawnGreen#7CFC00

초록 계열 · CSS 색 이름

HEX
#7CFC00
RGB
rgb(124, 252, 0)
HSL
hsl(90, 100%, 49%)
이 색으로 배색 만들기 →
라임Lime#00FF00

초록 계열 · CSS 색 이름

HEX
#00FF00
RGB
rgb(0, 255, 0)
HSL
hsl(120, 100%, 50%)
이 색으로 배색 만들기 →
라임 그린LimeGreen#32CD32

초록 계열 · CSS 색 이름

HEX
#32CD32
RGB
rgb(50, 205, 50)
HSL
hsl(120, 61%, 50%)
이 색으로 배색 만들기 →
포레스트 그린ForestGreen#228B22

초록 계열 · CSS 색 이름

HEX
#228B22
RGB
rgb(34, 139, 34)
HSL
hsl(120, 61%, 34%)
이 색으로 배색 만들기 →
그린Green#008000

초록 계열 · CSS 색 이름

HEX
#008000
RGB
rgb(0, 128, 0)
HSL
hsl(120, 100%, 25%)
이 색으로 배색 만들기 →
다크 그린DarkGreen#006400

초록 계열 · CSS 색 이름

HEX
#006400
RGB
rgb(0, 100, 0)
HSL
hsl(120, 100%, 20%)
이 색으로 배색 만들기 →
시 그린SeaGreen#2E8B57

초록 계열 · CSS 색 이름

HEX
#2E8B57
RGB
rgb(46, 139, 87)
HSL
hsl(146, 50%, 36%)
이 색으로 배색 만들기 →
미디엄 시 그린MediumSeaGreen#3CB371

초록 계열 · CSS 색 이름

HEX
#3CB371
RGB
rgb(60, 179, 113)
HSL
hsl(147, 50%, 47%)
이 색으로 배색 만들기 →
페일 그린PaleGreen#98FB98

초록 계열 · CSS 색 이름

HEX
#98FB98
RGB
rgb(152, 251, 152)
HSL
hsl(120, 93%, 79%)
이 색으로 배색 만들기 →
아쿠아마린Aquamarine#7FFFD4

청록 계열 · CSS 색 이름

HEX
#7FFFD4
RGB
rgb(127, 255, 212)
HSL
hsl(160, 100%, 75%)
이 색으로 배색 만들기 →
터쿼이즈Turquoise#40E0D0

청록 계열 · CSS 색 이름

HEX
#40E0D0
RGB
rgb(64, 224, 208)
HSL
hsl(174, 72%, 56%)
이 색으로 배색 만들기 →
미디엄 터쿼이즈MediumTurquoise#48D1CC

청록 계열 · CSS 색 이름

HEX
#48D1CC
RGB
rgb(72, 209, 204)
HSL
hsl(178, 60%, 55%)
이 색으로 배색 만들기 →
다크 터쿼이즈DarkTurquoise#00CED1

청록 계열 · CSS 색 이름

HEX
#00CED1
RGB
rgb(0, 206, 209)
HSL
hsl(181, 100%, 41%)
이 색으로 배색 만들기 →
아쿠아Aqua#00FFFF

청록 계열 · CSS 색 이름

HEX
#00FFFF
RGB
rgb(0, 255, 255)
HSL
hsl(180, 100%, 50%)
이 색으로 배색 만들기 →
틸Teal#008080

청록 계열 · CSS 색 이름

HEX
#008080
RGB
rgb(0, 128, 128)
HSL
hsl(180, 100%, 25%)
이 색으로 배색 만들기 →
다크 시안DarkCyan#008B8B

청록 계열 · CSS 색 이름

HEX
#008B8B
RGB
rgb(0, 139, 139)
HSL
hsl(180, 100%, 27%)
이 색으로 배색 만들기 →
라이트 시안LightCyan#E0FFFF

청록 계열 · CSS 색 이름

HEX
#E0FFFF
RGB
rgb(224, 255, 255)
HSL
hsl(180, 100%, 94%)
이 색으로 배색 만들기 →
스카이 블루SkyBlue#87CEEB

파랑 계열 · CSS 색 이름

HEX
#87CEEB
RGB
rgb(135, 206, 235)
HSL
hsl(197, 71%, 73%)
이 색으로 배색 만들기 →
라이트 스카이 블루LightSkyBlue#87CEFA

파랑 계열 · CSS 색 이름

HEX
#87CEFA
RGB
rgb(135, 206, 250)
HSL
hsl(203, 92%, 75%)
이 색으로 배색 만들기 →
딥 스카이 블루DeepSkyBlue#00BFFF

파랑 계열 · CSS 색 이름

HEX
#00BFFF
RGB
rgb(0, 191, 255)
HSL
hsl(195, 100%, 50%)
이 색으로 배색 만들기 →
도저 블루DodgerBlue#1E90FF

파랑 계열 · CSS 색 이름

HEX
#1E90FF
RGB
rgb(30, 144, 255)
HSL
hsl(210, 100%, 56%)
이 색으로 배색 만들기 →
콘플라워 블루CornflowerBlue#6495ED

파랑 계열 · CSS 색 이름

HEX
#6495ED
RGB
rgb(100, 149, 237)
HSL
hsl(219, 79%, 66%)
이 색으로 배색 만들기 →
스틸 블루SteelBlue#4682B4

파랑 계열 · CSS 색 이름

HEX
#4682B4
RGB
rgb(70, 130, 180)
HSL
hsl(207, 44%, 49%)
이 색으로 배색 만들기 →
로열 블루RoyalBlue#4169E1

파랑 계열 · CSS 색 이름

HEX
#4169E1
RGB
rgb(65, 105, 225)
HSL
hsl(225, 73%, 57%)
이 색으로 배색 만들기 →
블루Blue#0000FF

파랑 계열 · CSS 색 이름

HEX
#0000FF
RGB
rgb(0, 0, 255)
HSL
hsl(240, 100%, 50%)
이 색으로 배색 만들기 →
네이비Navy#000080

파랑 계열 · CSS 색 이름

HEX
#000080
RGB
rgb(0, 0, 128)
HSL
hsl(240, 100%, 25%)
이 색으로 배색 만들기 →
미드나이트 블루MidnightBlue#191970

파랑 계열 · CSS 색 이름

HEX
#191970
RGB
rgb(25, 25, 112)
HSL
hsl(240, 64%, 27%)
이 색으로 배색 만들기 →
슬레이트 블루SlateBlue#6A5ACD

보라 계열 · CSS 색 이름

HEX
#6A5ACD
RGB
rgb(106, 90, 205)
HSL
hsl(248, 53%, 58%)
이 색으로 배색 만들기 →
레베카 퍼플RebeccaPurple#663399

보라 계열 · CSS 색 이름

HEX
#663399
RGB
rgb(102, 51, 153)
HSL
hsl(270, 50%, 40%)
이 색으로 배색 만들기 →
블루 바이올렛BlueViolet#8A2BE2

보라 계열 · CSS 색 이름

HEX
#8A2BE2
RGB
rgb(138, 43, 226)
HSL
hsl(271, 76%, 53%)
이 색으로 배색 만들기 →
인디고Indigo#4B0082

보라 계열 · CSS 색 이름

HEX
#4B0082
RGB
rgb(75, 0, 130)
HSL
hsl(275, 100%, 25%)
이 색으로 배색 만들기 →
퍼플Purple#800080

보라 계열 · CSS 색 이름

HEX
#800080
RGB
rgb(128, 0, 128)
HSL
hsl(300, 100%, 25%)
이 색으로 배색 만들기 →
다크 오키드DarkOrchid#9932CC

보라 계열 · CSS 색 이름

HEX
#9932CC
RGB
rgb(153, 50, 204)
HSL
hsl(280, 61%, 50%)
이 색으로 배색 만들기 →
오키드Orchid#DA70D6

보라 계열 · CSS 색 이름

HEX
#DA70D6
RGB
rgb(218, 112, 214)
HSL
hsl(302, 59%, 65%)
이 색으로 배색 만들기 →
플럼Plum#DDA0DD

보라 계열 · CSS 색 이름

HEX
#DDA0DD
RGB
rgb(221, 160, 221)
HSL
hsl(300, 47%, 75%)
이 색으로 배색 만들기 →
바이올렛Violet#EE82EE

보라 계열 · CSS 색 이름

HEX
#EE82EE
RGB
rgb(238, 130, 238)
HSL
hsl(300, 76%, 72%)
이 색으로 배색 만들기 →
라벤더Lavender#E6E6FA

보라 계열 · CSS 색 이름

HEX
#E6E6FA
RGB
rgb(230, 230, 250)
HSL
hsl(240, 67%, 94%)
이 색으로 배색 만들기 →
핑크Pink#FFC0CB

분홍 계열 · CSS 색 이름

HEX
#FFC0CB
RGB
rgb(255, 192, 203)
HSL
hsl(350, 100%, 88%)
이 색으로 배색 만들기 →
라이트 핑크LightPink#FFB6C1

분홍 계열 · CSS 색 이름

HEX
#FFB6C1
RGB
rgb(255, 182, 193)
HSL
hsl(351, 100%, 86%)
이 색으로 배색 만들기 →
핫 핑크HotPink#FF69B4

분홍 계열 · CSS 색 이름

HEX
#FF69B4
RGB
rgb(255, 105, 180)
HSL
hsl(330, 100%, 71%)
이 색으로 배색 만들기 →
딥 핑크DeepPink#FF1493

분홍 계열 · CSS 색 이름

HEX
#FF1493
RGB
rgb(255, 20, 147)
HSL
hsl(328, 100%, 54%)
이 색으로 배색 만들기 →
페일 바이올렛 레드PaleVioletRed#DB7093

분홍 계열 · CSS 색 이름

HEX
#DB7093
RGB
rgb(219, 112, 147)
HSL
hsl(340, 60%, 65%)
이 색으로 배색 만들기 →
미디엄 바이올렛 레드MediumVioletRed#C71585

분홍 계열 · CSS 색 이름

HEX
#C71585
RGB
rgb(199, 21, 133)
HSL
hsl(322, 81%, 43%)
이 색으로 배색 만들기 →
시에나Sienna#A0522D

갈색 계열 · CSS 색 이름

HEX
#A0522D
RGB
rgb(160, 82, 45)
HSL
hsl(19, 56%, 40%)
이 색으로 배색 만들기 →
새들 브라운SaddleBrown#8B4513

갈색 계열 · CSS 색 이름

HEX
#8B4513
RGB
rgb(139, 69, 19)
HSL
hsl(25, 76%, 31%)
이 색으로 배색 만들기 →
초콜릿Chocolate#D2691E

갈색 계열 · CSS 색 이름

HEX
#D2691E
RGB
rgb(210, 105, 30)
HSL
hsl(25, 75%, 47%)
이 색으로 배색 만들기 →
페루Peru#CD853F

갈색 계열 · CSS 색 이름

HEX
#CD853F
RGB
rgb(205, 133, 63)
HSL
hsl(30, 59%, 53%)
이 색으로 배색 만들기 →
탠Tan#D2B48C

갈색 계열 · CSS 색 이름

HEX
#D2B48C
RGB
rgb(210, 180, 140)
HSL
hsl(34, 44%, 69%)
이 색으로 배색 만들기 →
로지 브라운RosyBrown#BC8F8F

갈색 계열 · CSS 색 이름

HEX
#BC8F8F
RGB
rgb(188, 143, 143)
HSL
hsl(0, 25%, 65%)
이 색으로 배색 만들기 →
베이지Beige#F5F5DC

뉴트럴 계열 · CSS 색 이름

HEX
#F5F5DC
RGB
rgb(245, 245, 220)
HSL
hsl(60, 56%, 91%)
이 색으로 배색 만들기 →
아이보리Ivory#FFFFF0

뉴트럴 계열 · CSS 색 이름

HEX
#FFFFF0
RGB
rgb(255, 255, 240)
HSL
hsl(60, 100%, 97%)
이 색으로 배색 만들기 →
화이트White#FFFFFF

뉴트럴 계열 · CSS 색 이름

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
이 색으로 배색 만들기 →
스노Snow#FFFAFA

뉴트럴 계열 · CSS 색 이름

HEX
#FFFAFA
RGB
rgb(255, 250, 250)
HSL
hsl(0, 100%, 99%)
이 색으로 배색 만들기 →
화이트 스모크WhiteSmoke#F5F5F5

뉴트럴 계열 · CSS 색 이름

HEX
#F5F5F5
RGB
rgb(245, 245, 245)
HSL
hsl(0, 0%, 96%)
이 색으로 배색 만들기 →
게인즈버러Gainsboro#DCDCDC

뉴트럴 계열 · CSS 색 이름

HEX
#DCDCDC
RGB
rgb(220, 220, 220)
HSL
hsl(0, 0%, 86%)
이 색으로 배색 만들기 →
실버Silver#C0C0C0

뉴트럴 계열 · CSS 색 이름

HEX
#C0C0C0
RGB
rgb(192, 192, 192)
HSL
hsl(0, 0%, 75%)
이 색으로 배색 만들기 →
다크 그레이DarkGray#A9A9A9

뉴트럴 계열 · CSS 색 이름

HEX
#A9A9A9
RGB
rgb(169, 169, 169)
HSL
hsl(0, 0%, 66%)
이 색으로 배색 만들기 →
그레이Gray#808080

뉴트럴 계열 · CSS 색 이름

HEX
#808080
RGB
rgb(128, 128, 128)
HSL
hsl(0, 0%, 50%)
이 색으로 배색 만들기 →
딤 그레이DimGray#696969

뉴트럴 계열 · CSS 색 이름

HEX
#696969
RGB
rgb(105, 105, 105)
HSL
hsl(0, 0%, 41%)
이 색으로 배색 만들기 →
슬레이트 그레이SlateGray#708090

뉴트럴 계열 · CSS 색 이름

HEX
#708090
RGB
rgb(112, 128, 144)
HSL
hsl(210, 13%, 50%)
이 색으로 배색 만들기 →
블랙Black#000000

뉴트럴 계열 · CSS 색 이름

HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
이 색으로 배색 만들기 →

색 이름을 읽는 작은 안내

이 사전은 W3C의 CSS 색 이름 중 이름 색상 86개를 담았습니다. 별도 탭에서는 216가지 웹 안전색 전체를 볼 수 있습니다. 한글은 이름을 쉽게 읽기 위한 표기이며, 계열은 탐색을 돕기 위한 분류입니다. 일반적인 색 이름은 재료나 색상 체계에 따라 다른 값을 가리킬 수 있어요.

HEX는 웹에서 사용하는 색상 코드, RGB는 빨강·초록·파랑의 양, HSL은 색상·채도·명도를 나타냅니다. HSL 값은 정수로 반올림했습니다. 화면 설정에 따라 색이 다르게 보일 수 있으며, 이 목록은 테스트의 12가지 대표 컬러와 별개의 색상 기준입니다.

색에 관한 이야기도 만나보세요 →