Haruni

はてなブログテーマ"Haruni"のデモページです。今後更新はないので読者登録は必要ありません。

背景色変更でフラットデザイン風の単色カラーに

はてなブログの管理画面>デザイン>カスタマイズ>背景色からグラデーション部分の簡単に背景色は変更出来ます。但しはてなブログで用意されているのは単色カラーです。
f:id:minimalgreen:20180315190748p:plain

またここで変更出来るのはbodyの背景色だけです。カテゴリーボタンや文字色は変わらないので、以下のCSSで色を調整して統一して下さい。
青系以外の場合は#8fd3f4をお好きなカラーコードへ変えてみてください。

/* 水色着せ替えbody以外 */
.entry-content h3, .categories a, .hatena-module-category .hatena-urllist li a, a.entry-see-more {
    background: #8fd3f4;
    /*  諸々背景色水色 */
}

@media only screen and (max-width:991px) {
    nav#slide-menu, div.menu-trigger {
        background: #8fd3f4;
        /*  スマートフォントグルメニュー */
    }
}

/* 文字色 */
a, .leave-comment-title, .hatena-module-title, .hatena-module-title a, .sns-twitter, .sns-facebook, .sns-bookmark, a.sns-bookmark:visited, .sns-googleplus, .sns-pocket, .sns-line, a.sns-link:hover {
    color: #8fd3f4;
}

.leave-comment-title {
    border: 1px solid #8fd3f4;
}

/* 見出し */
.entry-content h2 {
    position: relative;
    padding: 0.2em 0.5em;
    border-left: 8px solid #8fd3f4;
}

.entry-content h4 {
    position: relative;
    padding: .5em;
    color: #8fd3f4;
    border-top: 1px solid #8fd3f4;
    border-bottom: 1px solid #8fd3f4;
}

.entry-content h5 {
    position: relative;
    padding: .5em;
    color: #8fd3f4;
    border-left: 4px solid #8fd3f4;
}