なろうの目につくほぼ全てのものを目に優しく黒くしました。
初心者でも編集しやすいように全てにコメントを付けました。
画像例は「異邦人、ダンジョンに潜る。」というおすすめの作品です。
https://ncode.syosetu.com/n0260dj/
シン・なろうダークモード by masu
Details
Authormasu
LicenseCC BY-NC-SA
Category小説家になろう
Created
Updated
Size7.7 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name シン・なろうダークモード
@namespace Narou-dark
@description なろうの自作ダークモードです
@author https://twitter.com/Mathmaticsssss
@preprocessor stylus
@version 1.0.0
@license CC BY-NC-SA
==/UserStyle== */
// This userstyle uses Stylus-lang preprocessor.
// Complete preprocessor documentation at: https://stylus-lang.com
// Writing UserCSS: https://github.com/openstyles/stylus/wiki/Writing-UserCSS
@-moz-document domain("ncode.syosetu.com") {
/*配色*/
/*編集するときにもとのページもプレビューされるので二窓するのがおすすめです*/
:root{
/*本文*/
--TEXT:#fff;/*文字色*/
--BACK:#000;/*背色*/
/*各UI*/
--UI:#2b2b2b;/*UIの背色*/
--UI1:#bbbbbb;/*UIの文字色*/
--UI2:#fff;/*UIホバー時の文字色*/
--UI3:#787878;/*UIの外枠の色*/
/*タイトル欄*/
--TITLE:#dbdbdb;/*未読のタイトルと筆者の文字色*/
--TITLE1:#ebebeb;/*既読のタイトルと筆者の文字色*/
--TITLE2:#dbdbdb;/*「作者」と章の文字色*/
/*<<前へ 次へ>>*/
--NEXT:#ccc;/*未読の色*/
--NEXT1:#5b5b5b;/*既読の色*/
--NEXT2:#fff;/*ホバーするときの色*/
/*スクロールバー*/
--WIDTH:2px;/*横スクロールの太さ*/
--HEIGTH:0px;/*横スクロールの太さ*/
--SCBACK:#0000;/*背色*/
--SCBOTT:#9e9e9e;/*ボタンの色*/
/*その他(表示調整UI、ブックマーク設定変更UI、
ポイントを入れて作者を応援しましょう!、感想を書く、注意、フッター、感想入力欄*/
--OTHER:#fff;/*文字色*/
--OTHER1:#3f3f3f;}/*文字色*/
/*【ページトップ】*/
/*URLが切れて機能しなくなっている場合は縦48横5pxの画像のリンクを用意して下さい*/
#novel_header{background: url(https://drive.google.com/file/d/1RelSNrM9JrA0IjAnUjsrAQdUHZ9yYI-i/view?usp=share_link)
repeat-x top left var(--UI);/*背色*/
border-bottom:2px solid var(--UI3)}/*下の線*/
ul#head_nav li a{
color:var(--UI1);/*文字色*/
border:0px solid}/*文字の仕切り*/
ul#head_nav li a:hover{
background:var(--UI);/*ホバーするときの背色*/
color:var(--UI2)}/*ホバーするときの文字色*/
/*ブックマーク設定変更*/
ul#head_nav .booklist .change{
border:0px;/*外枠*/
background: var(--UI);/*背色*/
color: var(--UI1)}/*文字色*/
/*ホバーするとき*/
ul#head_nav .booklist a.change:hover{
border:0px;/*外枠*/
background: var(--UI);/*背色*/
color: var(--UI2)}/*文字色*/
/*ブックマーク設定変更UI*/
.narou_modal {
background: var(--UI);/*背色*/
color:var(--OTHER)}/*文字色*/
.narou_modal .favnovelmain_update h3 {
background: var(--UI)}
/*【表示調整】*/
/*ONのとき*/
#novelnavi_right #menu_on, #novelnavi_right #menu_off{
border:1px solid var(--UI3);/*外枠*/
background:var(--UI);/*背色*/
color:var(--UI1)}/*文字色*/
/*OFFのとき*/
#novelnavi_right #menu_off{
color:var(--UI2)}/*文字色*/
/*ホバーするとき*/
#novelnavi_right #menu_on:hover{
border-bottom:1px solid var(--UI3);/*外枠*/
background:var(--UI);/*背色*/
color:var(--UI2)}/*文字色*/
/* 【表示調整UI】*/
.novelview_navi{
background-color:var(--UI);/*背色*/
color:var(--OTHER)}/*文字色*/
#sasieflag,#novelview_navi_font,#novelview_navi_width{
background-color:var(--UI);/*設定項目の背色*/
color:var(--OTHER)}/*設定項目の文字色*/
/*【タイトル欄】*/
.contents1{
border:2px solid var(--UI3);/*外枠*/
background:var(--UI);/*背色*/
width:600px;/*幅*/
color:var(--TITLE2)}/*文字色*/
/*【タイトルと筆者の文字色】*/
.margin_r20, a{
color:var(--TITLE);/*未読のときの色*/
font-weight: bold}/*太さ*/
.margin_r20:visited, a:visited{
color:var(--TITLE1);/*既読のときの色*/
font-weight: bold}/*太さ*/
.margin_r20:hover, a:hover{
color:var(--UI2);/*ホバーしたときの色*/
font-weight: bold}/*太さ*/
/*【本文】*/
/*【全ての配色での配色の固定】*/
body,
body.customlayout1,body.customlayout2,
body.customlayout3,body.customlayout4,
body.customlayout5,body.customlayout6,
body.customlayout7{background-color:var(--BACK)}/*背景色*/
#novel_color,
#novel_color.customlayout1,#novel_color.customlayout2,
#novel_color.customlayout3,#novel_color.customlayout4,
#novel_color.customlayout5,#novel_color.customlayout6,
#novel_color.customlayout7{color:var(--TEXT)}/*文字色*/
/*<<前へ 次へ>>*/
#novel_contents a:link,
#novel_contents.customlayout1 a:link,#novel_contents.customlayout2 a:link,
#novel_contents.customlayout3 a:link,#novel_contents.customlayout4 a:link,
#novel_contents.customlayout5 a:link,#novel_contents.customlayout6 a:link,
#novel_contents.customlayout7 .customlayout-color a:link{color:var(--NEXT)}/*未読の色*/
#novel_contents a:visited,
#novel_contents.customlayout1 a:visited,#novel_contents.customlayout2 a:visited,
#novel_contents.customlayout3 a:visited,#novel_contents.customlayout4 a:visited,
#novel_contents.customlayout5 a:visited,#novel_contents.customlayout6 a:visited,
#novel_contents.customlayout7 .customlayout-color a:visited{color:var(--NEXT1)}/*既読の色*/
#novel_contents a:hover,
#novel_contents.customlayout1 a:hover,#novel_contents.customlayout2 a:hover,
#novel_contents.customlayout3 a:hover,#novel_contents.customlayout4 a:hover,
#novel_contents.customlayout5 a:hover,#novel_contents.customlayout6 a:hover,
#novel_contents.customlayout7 .customlayout-color a:hover{color:var(--NEXT2)}/*ホバーするときの色*/
/*【ページダウン】*/
.wrap_menu_novelview_after{
background-color:var(--UI)}/*背色*/
.list_menu_novelview_after a{
color: var(--UI1) !important}/*文字色*/
/*ホバーするとき*/
.list_menu_novelview_after a:hover{
color:var(--UI2) !important;/*文字色*/
background:var(--UI)}/*背色*/
.list_menu_novelview_after{
border:0px solid}/*外枠*/
.list_menu_novelview_after:first-child {
border-left:0px solid}/*外枠*/
/*ブックマーク設定変更*/
.footerbookmark li.booklist .change{
border-color:var(--UI);/*外枠*/
background:var(--UI);/*背色*/
color:var(--UI1) !important}/*文字色*/
/*ホバーしたとき*/
.footerbookmark li.booklist a.change:hover{
border-color:var(--UI);/*外枠*/
background:var(--UI);/*背色*/
color:var(--UI2) !important}/*文字色*/
/*【その他、ページボタン】*/
/*ページトップボタンの非表示*/
#pageTop,#pageBottom{display: none !important;}
/*ポイントを入れて作者を応援しましょう!、感想を書く、注意、フッター*/
#novel_hyouka,#impression, #review, #novel_attention, #footer{
border-color: var(--UI);/*外枠*/
background: var(--UI);/*背色*/
color:var(--OTHER) !important}/*文字色*/
/*感想入力欄*/
#impression textarea, #review textarea {
background:var(--OTHER1);/*背色*/
color:var(--OTHER)}/*文字色*/
/*フッターの文字色*/
#footer .undernavi a{color:var(--UI1);}
/*ホバーしたとき*/
#footer .undernavi a:hover{color:var(--UI2);}
/*【スクロールバー】*/
::-webkit-scrollbar{width:var(--WIDTH);height:var(--HEIGTH)}/*縦、横スクロールの太さ*/
::-webkit-scrollbar-track{background-color:var(--SCBACK)}/*背色*/
::-webkit-scrollbar-thumb{background-color:var(--SCBOTT)}/*ボタンの色*/
}