Skip to content
This repository has been archived by the owner on Dec 20, 2022. It is now read-only.

default.scssについて

AyumuNekozuki edited this page Nov 17, 2020 · 1 revision

基本的に /parts/_default.scssに指定されているものを利用します。

SCSSファイル上部に以下の記述を行いインポートしてください。

@import '/parts/_default'; //相対パス指定です各自書き換えしてください。

カラーコードでの直接指定は避け、できるだけ$nico-blackのように記述してください。

一部、履歴削除などで利用されるredのみ直接指定OKです。

配色について

背景色

暗い順に以下の順で利用してください。

1. $main-background-color #1A1B1C
2. $nico-black #252525
3. $sub2-background-color #333333

マウスホバー時背景色 $hover-background-color #555555
リンクボタンなど $main-url-color #0080FF
削除ボタンなどの特別色 red

文字色

強調したい順に以下の順で利用してください。

1. $main-text-color #F5F5F5
2. $sub-1-text-color #c4c4c4
3. $sub-2-text-color #999999
4. $sub-3-text-color #666666

URL色 $main-url-color #0080FF
削除や新規投稿などの特別色 red

その他色

- ニコニココンテンツ色 後術
- border $border-background-color #555555

- ロゴ等の色反転 $invert invert(100%)

ニコニココンテンツ

名前と内容が一致するものを利用してください

$nico-black: #252525; ニコニコブラック
$nico-white: #FAFAFA; 通常時背景色

$nico-personal-topics: #30A6CA; 総合TOP/マイページ内「あなたへのオススメ情報」欄

$nico-premium: #d9a300; ニコニコプレミアム
$nico-point: #D1A437; ニコニコポイント
$nicoru: #FCD842; ニコる

$nico-illust: #EDA815; 静画:イラスト
$nico-manga: #88C148; 静画:マンガ
$nico-game: #046EB8; アツマール
$nico-app: #046EB8; アプリ
$nico-dic: #FFAF19; 大百科
$nico-com: #258D8D; コミュニティ
$nico-news: #ff8000; ニュース
$nico-jk: #C3291F; 実況

$nicobox: #D83A35; Nicobox
$N-yobiko: #000066; N予備校

$nicoad-gold: #E5A900; 広告枠GOLD
$nicoad-silver: #CFDBDD; 広告枠SILVER