HEX, RGB, HSL과 투명도를 사용해 색상을 표현합니다.
HEX는 채널을 16진수로, rgb는 빨강·초록·파랑을, hsl은 색상·채도·명도를 표현합니다. alpha가 포함된 rgb나 hsl은 배경이 비치는 반투명 색을 만듭니다.
글자색으로 쓴 16진수 176b45를 두 자리씩 끊은 17, 6b, 45를 10진수로 바꾸면 23, 107, 69이므로, 배경의 rgb(23 107 69 / 0.14)는 글자와 같은 초록입니다. 다만 알파가 0.14라서 14%만 칠해지고 흰 .demo 바탕이 비쳐 옅은 초록이 됩니다. .second는 hsl(38 100% 31%)의 짙은 호박색 글자를 크림색 배경 위에 놓습니다.
예제의 rgb(23 107 69 / 0.14)는 채널을 쉼표 없이 공백으로 나누고 슬래시 뒤에 알파를 적는 문법입니다. 예전 코드에 자주 보이는 rgba(23, 107, 69, 0.14)와 같은 색이고, 지금은 rgb와 rgba가 서로의 별칭이라 어느 이름에든 알파를 넣을 수 있습니다. HEX도 끝에 두 자리를 더한 8자리 표기로 알파를 담습니다.
텍스트와 배경색의 대비가 낮으면 내용을 읽기 어렵습니다.
직접 바꿔보세요같은 초록색을 HEX와 HSL 두 방식으로 표현하세요.