読者です 読者をやめる 読者になる 読者になる

はんぺんの雑記帳

好きなことを掘り下げます。

蛍光ペンの色を変える方法【はてなブログ】

こんにちは、カスタマイズにハマりかけているはんぺん(@hanpen_005)です。

f:id:hanpen_005:20170211222504j:plain

今回はデフォルトで黄色になっている蛍光ペン(風強調)の色を変更してみました。

こんな感じ。

自分で調べたことを記事にまとめておきたいと思います。

 

1,蛍光ペン表示になるようにする

まずはデフォルトの蛍光ペン表示を導入してね。

この表示は「太字」の強調を「太字+マーカー」に置き換えたものです。

太字のみの表示は基本的にできなくなります。

(分ける方法もあるみたいですが私は今はしてません)

 

こちらの記事を参考にさせていただきました

darie-daphnia.hatenablog.com

 

2.変更したい色のカラーコードを調べる

まずは自分の好きな色を見つけましょう。パレットから選んでもいいし、お好みの色をカラーピッカーで調節してもOKです。

html-color-codes.info

 

ここで注意するのが、”RGB”っていうコードを調べなきゃいけないこと。

上記の記事で”色を変えるにはここを置き換え”とあるのですがそこだけ変えても色が変わりませんでした・・・。

16進法(#ff9966みたいな)だけでなく下の数字も一部変える必要があります。

RBG形式のコードは上記の「HTMLカラーコード」から簡単に調べることができます。

 

f:id:hanpen_005:20170211225531j:plain

f:id:hanpen_005:20170211225546j:plain

 この丸の中の数値をつかいます!

3,コードを変更する

①~③のあと出てきたこのコードを、設定>詳細設定>headに要素を追加 で蛍光ペンを導入した部分に入力します。

 

 

f:id:hanpen_005:20170211230414j:plain

左から順にRGBの数値を入れればOKです。

①の記事の変更部も変えておきましょう。

 

おまけ

rgba(◯,◯,◯,1)となっている最後の1は色の不透明度のようです。

 

CSS3で知っておきたい基礎知識「RGBa」の徹底解説!|最適化ノウハウコラム記事 ~スマートフォン最適化・スマートフォン対応サイト制作はTOUCH&SLIDEへ~

 

デフォルトでは「0.8」になっているのですが背景白で違いあるかな・・・?

↓「1」設定

f:id:hanpen_005:20170211231157p:plain

↓「0.8」設定

f:id:hanpen_005:20170211231239p:plain

結構薄いな。

私のブログは背景が白なのであまり支障はありませんが、背景が色付きの方は「0.8」もしくはもうすこし透明度の高い方が背景色との馴染みが良いかもしれません。

 

まとめ

一度設定できれば次から簡単に色の変更もできるので、やってみる価値ありかなと思います。

こういう色で個性をだすのも面白いですね。

 

以上、はんぺんでした!