JavaScript에서 screen.colorDepth 속성을 사용하면 현재 화면에 하나의 색상을 표시하는 데 사용되는 비트 수를 손쉽게 확인할 수 있습니다.
screen.colorDepth 속성이란?
screen.colorDepth는 사용자의 모니터가 색상을 표현하기 위해 사용하는 비트 수를 정수 값으로 반환합니다. 일반적으로 반환되는 값은 다음과 같습니다.
- 24비트: 약 1,670만 가지 색상을 표현할 수 있는 트루 컬러 방식
- 32비트: 24비트 색상에 8비트 알파 채널이 추가된 방식
- 16비트: 하이 컬러라고 불리며, 주로 구형 시스템에서 사용
예제
다음 코드를 실행하면 화면 크기와 함께 색상 깊이도 함께 출력하여 확인할 수 있습니다.
<!DOCTYPE html>
<html>
<body>
<script>
document.write("화면 너비: " + screen.width);
document.write("<br>화면 높이: " + screen.height);
document.write("<br>색상 깊이: " + screen.colorDepth);
</script>
</body>
</html>
참고 사항
색상 깊이를 확인할 때는 screen.pixelDepth 속성을 사용할 수도 있습니다. 이 속성은 픽셀당 비트 수를 반환하며, 대부분의 환경에서 colorDepth와 동일한 값을 나타냅니다. 두 속성 모두 Chrome, Firefox, Safari, Edge 등 모든 주요 브라우저에서 지원되므로 호환성 걱정 없이 사용할 수 있습니다.