Ask HN: HN을 다크 모드로 어떻게 볼 수 있나요?
Ask HN: How can I browse HN in dark mode?
저는 아기가 제 위에서 자고 있어서 화면 불빛이 너무 눈부셔요. 그래서 HN을 다크 모드로 보고 싶습니다. 어떻게 하면 좋을까요?
Android에서는 Vivaldi가 다크 모드를 기본 지원합니다. 실제로는 모든 Chromium 기반 브라우저에 있는 다크 모드 토글일 뿐이고, chrome://flags/#enable-force-dark에서 전역으로 활성화할 수 있습니다. 흔히 추천되는 Dark Reader는 특히 오래된 하드웨어에서 매우 느립니다. 이 내장 모드는 훨씬 효율적이고 대부분의 페이지에서 잘 작동합니다.
https://hcker.news에 여러 다크 모드 테마가 있습니다.
Chrome용 Dark Reader 확장 프로그램.
Firefox에서 Darkreader 확장 프로그램
저는 FF에서 HN Enhance 확장 프로그램을 사용합니다.
HN 토론
35- Bender
uBlock Origin -> My Filters에:
# HN dark Mode:
news.ycombinator.com##body:style(background: black)
news.ycombinator.com##td:style(color: #fafafa !important)
news.ycombinator.com##table:style(background-color: #24273a)
news.ycombinator.com##div.toptext:style(color: #fafafa)
news.ycombinator.com##div.c00:style(color: #fafafa !important)
news.ycombinator.com##a:style(color: #ffa000 !important)
news.ycombinator.com##span#karma:style(color: #faa000 !important)
news.ycombinator.com##span.pagetop:style(color: #fafafa !important)
news.ycombinator.com##textarea:style(color: #696969 !important; background: inherit; )
news.ycombinator.com###hnmain:style(background: #24273a !important)
- farlight
Android에서는 Vivaldi가 다크 모드를 기본으로 지원합니다. 사실 이건 모든 Chromium 기반 브라우저에 있는 다크 모드 토글일 뿐이고, chrome://flags/#enable-force-dark에서 전역으로 활성화할 수 있습니다.
자주 추천되는 Dark Reader는 특히 오래된 하드웨어에서 매우 느립니다. 이 내장 모드가 훨씬 효율적이고 대부분의 페이지에서 잘 작동합니다.
- WithinReason
이걸 북마클릿에 저장하고 클릭하면 어떤 웹사이트든 다크 모드로 바꿀 수 있습니다:
javascript:(function(){const id='_dark_mode_bm';const el=document.getElementById(id);if(el){el.remove();}else{const s=document.createElement('style');s.id=id;s.textContent='html{filter:invert(1) hue-rotate(180deg)!important;background:#fff!important;}img,video,canvas,picture,svg{filter:invert(1) hue-rotate(180deg)!important;}';document.head.appendChild(s);}})();
더 빠른 버전:
javascript:(function(){const id='_dark_perf_bm';const el=document.getElementById(id);if(el){el.remove();}else{const s=document.createElement('style');s.id=id;s.textContent=':root{color-scheme:dark!important;}html,body{background-color:#141414!important;color:#dcdcdc!important;}div,section,article,nav,header,footer,aside,main,table,tr,td,th,ul,ol,li{background-color:#18191a!important;color:#dcdcdc!important;border-color:#383838!important;}p,span,h1,h2,h3,h4,h5,h6,b,strong,i,em{color:inherit!important;}a,a%20*{color:#58a6ff!important;}pre,code,kbd{background-color:#202224!important;color:#ff9857!important;}input,textarea,select,button{background-color:#262626!important;color:#fff!important;border:1px%20solid%20#444!important;}img,video,canvas,picture{background-color:transparent!important;}';document.head.appendChild(s);}})();
- accrual
저는 Stylus와 이 테마를 사용하고 있습니다:
body {
background-color: #262626 !important;
}
body > center > table, input, textarea {
background-color: #222 !important;
}
body > center > table > tbody > tr:first-child > td {
background-color: #ff6600 !important;
}
/* 밝은 텍스트 */
td.title a:link, span.comment font, span.comment font a:link, u a:link, span.yclinks a:link, body:not([id]),
td:nth-child(2):not(.subtext) > a:link, input, textarea, p > a, a > u, .c00, .c00 a:link,
a[href="http://www.ycombinator.com/apply/"], a[href="https://www.ycombinator.com/apply/"] {
color: #ccc !important;
}
.admin td {
color: #aaa !important;
}
/* 검색 상자와 댓글 상자 */
input, textarea {
border: 1px solid #828282 !important;
}
- Meneth
설정 -> 접근성에서 "색상 재정의"를 사용해 멋진 다크 색상을 설정했습니다.
그런 다음 https://github.com/AlexVallat/firefox-scripts/의 userChrome.js를 사용해 브라우저 환경 설정인 "browser.display.use_system_colors"와 "browser.display.document_color_use"를 토글하는 버튼을 추가했습니다. 그래서 필요하면 여전히 밝은 모드에 접근할 수 있습니다.