HEX, RGB, HSL과 투명도를 사용해 색상을 표현합니다.
HEX는 채널을 16진수로, rgb는 빨강·초록·파랑을, hsl은 색상·채도·명도를 표현합니다. alpha가 포함된 rgb나 hsl은 배경이 비치는 반투명 색을 만듭니다.
이번 예제의 출발점은 color: #176b45; background: rgb(23 107 69 / .15);입니다. 선택자가 고른 요소와 실제로 계산된 값을 개발자 도구에서 나란히 보면 선언이 적용되지 않은 이유를 빠르게 찾을 수 있습니다.
처음에는 예제를 그대로 확인한 다음 같은 초록색을 HEX와 HSL 두 방식으로 표현하세요. 한 번에 한 값만 바꾸고 좁은 화면, 키보드 포커스와 200% 확대에서도 내용이 사라지지 않는지 확인하세요.
텍스트와 배경색의 대비가 낮으면 내용을 읽기 어렵습니다.
직접 바꿔보세요같은 초록색을 HEX와 HSL 두 방식으로 표현하세요.