LUSH MY LIFE.

ジャニヲタとして生きる

「ティファニーブルー」でブログをカスタマイズしました

ブログのデザインをもっと爽やかな感じにしたくて、デザインを変えました!
覚書として、参考にしたサイトや手書きのCSSを載せておきます。

f:id:lml320:20170117165629p:plain

カスタマイズをするとテンションup

昔から、サイトのデザインを変えるのが好きでした。ブログはいわば自分だけの自由帳のようなもの。日々目にする頻度も高いので、やっぱり好きなデザインにするのが一番テンションが上がります。

テーマカラーは「ティファニーブルー」

女子の憧れ、ティファニー。そのボックスの色が例に漏れず好きです。
ということで、こちらのサイトを参考にティファニーブルーのカラーコードを取得し、サイトのカスタマイズをしました。

当サイトは「#81d8d0」をメインで使っています。

prebride-wedding.com

サイドバーの背景色と文字色をいじる 

CSSに以下を追加しました。

.hatena-module-title {
background-color:#81d8d0;
color:#ffffff;
padding: 10px 15px;

タイトル、大見出し、中見出しをかわいく

基本のタグはこちらのサイトを参考にし、カラーコードなどをちょっといじっています。

こんな感じ

yuicreate.com

中見出しはfont awesomeを使っています。

こんな感じ

fontawesome.io

font awesomeを使うためには、headに要素を追加する必要があります。やり方はこちらのサイトがわかりやすかったので使わせていただきました!

moghouse.hatenablog.com

font awesomeを使った中見出しは、こちらのサイトを参考にCSSを書きました。

cgsc.info

強調文字を蛍光ペン風にする

こちらのサイトを参考にしました。

まなしばさんのブログは好きで、よく読んでいます。同じ区に住んでいることもあり、保育園のことなど参考にさせていただいています。

mama-hack.com

テーマは「Innocent」

ちなみに、テーマは「Innocent」に戻しました。「DUDE」はおしゃれすぎた。私みたいな小市民にはDUDEなんて言葉はもったいなかった。

Innocent - テーマ ストア

DUDE - テーマ ストア