다크 모드

그놈의 다크 테마

일반 디스플레이 모드(왼쪽)과 다크 모드(오른쪽)의 웹사이트 버전 비교

그린 온 블랙 CRT 디스플레이에서 실행 중인 비디오 게임 조크(Zoerk)

다크 모드(영어: Dark Mode), 다크 테마(dark theme), 블랙 모드(black mode), 나이트 모드(night mode)는 밝은 색의 텍스트, 아이콘, 그래픽 사용자 인터페이스 요소들을 어두운 배경 위에 사용하는 컬러 스킴으로, 컴퓨터 사용자 인터페이스 디자인과 웹 디자인 면에서 자주 논의되는 모드이다. 현대의 수많은 웹사이트와 운영 체제는 사용자에게 선택적 다크 모드를 제공하고 있다.

일부 사용자들은 다크 모드가 더 시각적으로 매력적으로 느끼며 전력 소비 감소를 경험한다.^[1] OLED 디스플레이를 사용하는 2016년형 구글 픽셀 기준으로 온전한 밝기의 흰색을 표시할 경우 순수 블랙보다 대략 6배나 더 많은 전력을 사용한다.^[2] 게다가 화면 표면의 얼룩이 덜 보인다.

근래의 운영 체제는 선택적 다크 모드 스킨을 지원한다.^[3]

역사

음극선 오실로그래프, 오실로스코프 등의 현대 컴퓨터 화면의 전신은 그래프를 그리고 다른 콘텐츠를 검정색 배경에 빛나게 하도록 표시하는 경향이 있었다.

컴퓨터 화면이 도입되면서 원래 사용자 인터페이스는 오실로그래프나 오실로스코프에 사용되는 것과 같은 음극선관(CRT)에 형성되었다. 형광체는 일반적으로 매우 어두운 색상이었으며, 전자빔이 닿으면 밝게 빛나며 단색 화면에 적용된 형광체에 따라 검정색 배경에 흰색, 녹색, 파란색 또는 호박색으로 나타난다. RGB 화면은 흰색을 형성하기 위해 "켜짐"으로 설정된 모든 빔을 사용하여 유사하게 계속 작동했다.

텔레텍스트의 출현으로 이 새로운 매체에 가장 적합한 기본 및 보조 조명 색상과 조합에 대한 연구가 수행되었다.^[4] 검정색 바탕의 청록색 또는 노란색은 일반적으로 검정색, 빨간색, 녹색, 노란색, 파란색, 마젠타색, 청록색 및 흰색 팔레트에서 최적인 것으로 나타났다.

밝은 색에 어두운 색 구성표인 반대 색 세트는 원래 종이에 잉크를 시뮬레이션하기 위해 위지위그 워드 프로세서에 도입되어 표준이 되었다.

마이크로소프트는 2016년 윈도우 10 1주년 업데이트에서 다크 테마를 도입했다. 2018년 애플은 macOS 모하비를 선보였다. 2019년 9월, iOS 13과 Android 10 모두 다크 모드를 도입했다.

파이어폭스 및 크로미엄에는 모든 내부 화면에 대해 선택적인 다크 테마가 있다. 타사 개발자가 자신만의 다크 테마를 구현하는 것도 가능하다.

2019년에는 프런트 엔드 웹 개발자를 위해 "prefers-color-scheme" 옵션이 생성되었다. 이는 사용자가 시스템에서 밝거나 다크 색상 테마를 사용하도록 선택했음을 알리는 CSS 속성이다.

에너지 사용량

어두운 색 구성표의 빛은 OLED 디스플레이에 표시하는 데 더 적은 에너지를 필요로 한다. 이는 배터리 수명에 긍정적인 영향을 미치고 에너지 소비를 줄인다.

OLED는 주로 검은색 이미지를 표시하는 데 LCD 전력의 약 40%를 소비하지만, 문서나 웹 사이트와 같이 흰색 배경의 이미지를 표시하는 데는 3배 이상의 전력을 사용할 수 있다. 어두운 색 구성표를 사용하지 않으면 배터리 수명과 에너지 사용량이 줄어들 수 있다. 장기적으로 전력 사용량을 줄이면 배터리 수명이나 디스플레이 및 배터리의 유효 수명이 연장될 수도 있다.

라이트 온 다크(Light-on-Dark) 색상 구성표를 사용하여 에너지를 절약할 수 있는 이유는 OLED 화면의 작동 방식 때문이다. 즉, OLED 화면에서 각 하위 픽셀은 자체 빛을 생성하고 빛을 생성할 때만 전력을 소비한다. 이는 LCD 작동 방식과 대조된다. LCD에서 하위 픽셀은 항상 켜져 있는(밝은) LED 백라이트의 빛이 통과하도록 차단하거나 허용한다.

"AMOLED Black" 색상 구성(진한 회색 대신 순수한 검정색 사용)은 검정색 대신 어두운 회색을 사용하는 다른 라이트 온 다크 색상 구성보다 반드시 더 많은 에너지를 절약하지는 않는다. AMOLED 화면의 전력 소비는 표시된 픽셀의 평균 밝기. AMOLED 검정색이 어두운 회색보다 에너지를 더 많이 절약하는 것은 사실이지만 추가적인 에너지 절약 효과는 무시할 수 있는 경우가 많다. 예를 들어 AMOLED 블랙은 구글 공식 안드로이드 앱의 다크 테마에 사용되는 어두운 회색에 비해 1% 미만의 추가 에너지 절약 효과만 제공한다. 2018년 11월 구글은 안드로이드의 다크 모드가 배터리 수명을 절약한다는 사실을 확인했다.

웹 관련 문제

어떤 사람들은 어두운 배경에 밝은 텍스트가 있는 색 구성표가 화면에서 읽기 더 쉽다고 주장한다. 전체 밝기가 낮을수록 눈의 피로가 덜하기 때문이다. 다른 사람들은 그 반대라고 주장한다. 주의할 점은 웹의 대부분 페이지가 흰색 배경용으로 디자인되었다는 것이다. 알파 채널 대신 투명도 비트가 있는 GIF 및 PNG 이미지는 윤곽선이 고르지 않게 표시될 뿐만 아니라 다른 그래픽 요소에 문제를 일으키는 경향이 있다.

CSS에는 사용자가 밝은 색 구성표나 어두운 색 구성표를 요청했는지 감지하고 요청한 색 구성표를 제공하는 기본 색상 구성표 미디어 기능이 있다. 이는 사용자의 운영 체제 기본 설정이나 사용자 에이전트를 통해 표시될 수 있다.

CSS 예:

@media (prefers-color-scheme: dark) {
    body {
        color: #ccc;
        background: #222;
    }
}

자바스크립트 예:

if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
    dark();
}

같이 보기

• 능동형 유기 발광 다이오드
• 나이트 시프트 (소프트웨어)
• 유기 발광 다이오드

각주

1. “Dark mode is easier on your eyes and battery”. 2018년 11월 21일. 
2. Emily Price (2018년 11월 11일). “Use Dark Mode to Conserve Your Phone's Battery Power”. 《Lifehacker》. 2021년 3월 20일에 확인함. 
3. David Murphy. “Embrace Evil by Enabling Dark Mode in Every App”. 《Lifehacker》 (미국 영어). 2020년 11월 15일에 확인함. 
4. Petterson, Rune (March 1985). “Use of colors in Teletext and Videotex”. 《ResearchGate》.