스마트폰 사용 시간이 많아지다 보니 눈의 피로도를 느끼는 상황이 자주 발생하기도 합니다. 일상에서의 스마트폰 사용 뿐만 아니라 업무 적으로 컴퓨터 사용 시간도 많다 보니 자신도 모르게 눈을 자꾸 혹사하게 됩니다.
그래서 자신의 눈을 조금이나마 보호하기 위해 스마트폰이나 컴퓨터를 다크모드(어둡게)로 설정해서 사용하는 사람들도 많아지고 있습니다.
이번 글에서 소개할 내용은 스마트폰이나 윈도우 컴퓨터의 다크모드 설정이 아니라 크롬 브라우저에서 웹 컨텐츠에 대한 다크모드 설정에 대한 설명입니다.
일반적인 크롬 브라우저의 다크모드 설정은 브라우저 자체에 대한 설정이 대부분입니다. 크롬 브라우저를 다크모드로 설정했다고 해서 브라우저 내에 표시되는 실제 웹 사이트의 페이지 컨텐츠가 다크모드로 나타나는 것은 아닙니다.
웹 사이트의 페이지 컨텐츠는 고유한 디자인으로 구성이 되어 있기에 크롬 브라우저를 다크모드로 변경하더라도 내부 웹 페이지 컨텐츠에는 영향을 주지 못하기 때문입니다.
하지만 크롬의 확장 프로그램을 사용하거나 실험 버전인 Flags를 설정하면 웹 사이트의 내부 컨텐츠까지 다크모드로 표시할 수 있습니다.
지금부터 크롬 브라우저 다크모드(Dark Mode) 설정 방법(사이트 내부 컨텐츠 다크모드)에 대해 알아보겠습니다.
Chrome 다크모드 설정 – Dark Reader 확장 프로그램을 사용 방법
크롬에는 필요한 기능을 확장 프로그램을 설치해서 쉽게 구현할 수 있습니다.
웹 페이지의 내부 컨텐츠를 다크모드로 변환해서 보여주는 것도 확장 프로그램으로 구현이 가능합니다.
여기에서 소개할 확장 프로그램은 “Dark Reader” 입니다.
1. 확장 프로그램을 설치하기 위해 크롬 브라우저의 Chrome 맞춤설정 및 제어에서 확장 프로그램을 선택하고, 다시 Chrome 웹 스토어 방문하기를 클릭해 줍니다.
2. Chrome 웹 스토어 페이지에서 “Dark Reader“를 검색합니다.
3. 아래 화면과 같은 이미지의 Dark Reader 확장 프로그램이 검색되면 마우스 클릭해서 확장 프로그램 설치 화면으로 이동합니다.
4. 확장 프로그램을 설치하기 위해 Chrome에 추가 버튼을 클릭합니다.
5. 확장 프로그램을 추가할 것인지 확인하는 팝업 창에서 확장 프로그램 추가를 클릭해 줍니다.
- 특별한 설치 과정 없이 곧바로 설치가 완료됩니다.
6. 크롬 브라우저의 우측 상단에 확장 프로그램 방금 설치한 확장 프로그램이 추가됩니다.
7. DARK READER 확장 프로그램 클릭하면 다양한 옵션을 설정할 수 있습니다.
- 확장 프로그램 기능을 “켬” 또는 “끔”으로 활성화 또는 비활성화 할 수있습니다.
- 테마를 바꾸거나 밝기 등을 조절할 수 있습니다.
- 특정 사이트만 다크모드를 변경할 수도 있습니다.
8. 아래 화면은 Dark Reader 확장 프로그램으로 다크모드로 설정하고 네이버 페이지에 접속했을 때의 화면입니다.
9. 전반적으로 다크모드로 전체 페이지가 표시되지만 가독성에서 약간 문제가 있어 보입니다.
Dark Reader의 옵션 설정을 조금 수정해서 확인해 볼 필요가 있어 보입니다.
10. 확장 프로그램 제거는 4번의 화면에서 Chrome에서 삭제를 클릭해 주면 됩니다.
- 확장 프로그램이 설치되어져 있는 경우 Chrome에 추가 대신 Chrome에서 삭제로 버튼이 변경됩니다.
- 또는 크롬 브라우저의 우측 상단에 있는 확장 프로그램 버튼을 클릭해서 해당 확장 프로그램을 제거할 수 있습니다.
Chrome 다크모드 설정 – 크롬 브라우저 실험 버전의 Flags 설정 변경 방법
크롬 브라우저에 다크모드로 변환하는 기능을 내포하고 있습니다. 단지 아직 정식으로 사용할 수 있는 기능은 아니고, 필요한 사용자가 직접 설정을 변경해서 사용할 수 있는 기능입니다.
1. 크롬 창에서 주소 표시줄에 “chrome://flags“를 입력하고 엔터를 누릅니다. 그럼 Expreiments(실험) 페이지도 이동합니다.
– 실험 페이지는 크롬 브라우저에 아직 정식으로 구현되기 전의 실험(베타) 버젼의 기능을 모아놓은 페이지 입니다.
2. 검색 상자에 “Dark‘을 입력합니다. 그럼 첫 번째에 “Auto Dark Mode for Web Contents“가 나타납니다.
3. Auto Dark Mode for Web Contents 플래그 옆에 있는 드롭다운에서 [Enabled]를 선택합니다.
4. 그리고 하단에 나타나는 [Relaunch] 버튼을 클릭하면 크롬 브라우저의 다크 모드 기능이 활성화 됩니다.
5. Auto Dark Mode for Web Contents를 “Enabled” 한 뒤에 네이버로 접속했을 때 화면입니다.
- 앞 단락의 Dark Reader 확장 프로그램 보다는 좀 더 보기 원활한 다크 모드 페이지가 표시되는 듯 합니다.
- 실험 버전이기 때문에 예기치 못한 오류가 발생할 수도 있습니다. 이점은 참고하세요.
6. 다시 일반적인 밝기 모드로 변경하려면 Auto Dark Mode for Web Contents 속성을 다시 Disabled로 변경해 주면 됩니다.
7. Enabled 할 때와 마찬가지로 Disabled로 선택한 다음 Relaunch를 클릭해서 속성을 적용해 주면 됩니다.
마무리
웹 컨텐츠를 다크 모드로 변환하는 방법 두 가지에 대해 알아보았습니다.
확장 프로그램 Dark Reader를 사용하는 경우 다크 모드와 일반 밝기 모드로 변환이 수월하다는 장점이 있습니다. 반면에 웹 사이트에 따라 컨텐츠를 보는 데 불편함이 따를 수도 있습니다.
실험 버전(flags)의 Auto Dark Mode for Web Contents 설정은 컨텐츠가 좀 더 자연스럽게 다크 모드로 변환해서 보여 주는 장점이 있습니다. 반면에 다크 모드와 일반 밝기 모드로 변환하는데 다소 불편함이 있습니다.
다크 모드 사용 빈도가 많은 경우 Auto Dark Mode for Web Contents를 사용하는 것이 편리하고, 잠깐 잠깐 다크 모드 변환은 Dark Reader 확장 프로그램 사용이 좀 더 편리합니다.
※ 함께 읽으면 도움이 될 만한 다른 포스팅 글입니다.
이 글이 도움이 되었기를 바랍니다. ^-^