색상 표현법

색상 표현 방법

CSS에서 사용할 수 있는 5가지의 색상 표현 방법입니다.

CSS는 폰트, 배경, 블록, 테두리 등에 색상을 넣을 수 있으며 각 요소 혹은 요소 뒤에 -color 을 붙여 색상을 적을 수 있습니다.

표현법	설명	예시
색상명	색상의 이름으로 표현하는 방법으로 약 140가지의 이름이 정의되어 있습니다. 표현 가능한 색상명은 여기에서 확인 가능합니다.	color: red;
		color: GreenYellow;
rgb 표현	rgb(red, green, blue) 표현은 각 색의 0에서 255사이의 정수를 입력하여 색을 표현하는 방법입니다.	color: rgb(255, 0, 0);
		color: rgb(154, 205, 50);
16진수(HEX) 표현	rgb 색상값을 각각 16진수로 변환하여 표현한 값입니다.	color: #ff0000;
		color: #9acd32;
hsl 표현법	HSL은 Hue(색상), Saturation(채도), Lightness(명도)로 색상을 정의하는 방법입니다. 색상은 0부터 360까지의 색상환에 따라 결정되며, 채도와 명도는 백분율로 나타냅니다.	color:hsl(9, 100%, 50%);
		color: hsl(80, 61%, 50%);
hwb 표현법	hwb 표현법은 주어진 색상을 색상, 백색, 흑색에 따라 표현하는 방법입니다.	color: hwb(0, 0%, 0%);
		color: hwb(80, 20%, 20%);
opacity 속성	색상 요소의 불투명도를 설정하는 속성입니다. 그 외에도 그림, 블록 등의 불투명도를 설정할때도 사용합니다. 색상의 불투명도를 정할땐 rgba를 사용하며 마지막 부분에 0-1 사이의 숫자를 적어 표현합니다.. 0으로 갈수록 투명해집니다.	color: rgba(255, 0, 0, 0.5); color: rgba(#ff0000, 0.5); color: rgba(9, 100%, 50%, 0.5);