CSS HTML 初心者 勉強中。

CSS HTML 初心者です。備忘録的メモです。

   当サイトはアフィリエイト広告を利用しています

色をつけたい。HTML, CSS カラーコードの話。

f:id:mikanusagi:20180504150209p:image こんにちは。

     文字に色をつけたりするには、カラーコードを利用します。

 

 

 

カラーコードとは?

たとえば、

赤色にしたい。

これは、はてなブログのHTML編集でみると、

<p><span style="color: #ff0000;">赤色にしたい。</span></p>

こうなっています。

この、color のところにある、#FF0000が、赤を示しているということです。

 

【#と、そのあとの6つの文字や記号で色を指定】 します。

この数字は、16進法らしく、0-9とA-Fの16文字を使って、、、

まあややこしいことは置いておいて。。 

 

f:id:mikanusagi:20180504152407p:plain ◀ 3色の組み合わせ。

 

この組み合わせで、赤緑青の色を調整して、色が決まります。

いわゆる光の三原色。

ちなみに、00が最も薄くて、FFが最も濃い色になります。

FF0000は、赤が濃くて、他が薄いから、純粋な赤になるんですね。

 

 

WEBセーフカラーとは?

色のことを調べていると、この言葉をみかけることがあります。

 

8ビットカラーの256色のうち、マッキントッシュや、Windowsなどの環境に関係なく、正しく表示できる色のこと。

RGBの各々の色を6段階に分けた組み合わせで表示できる、

6×6×6=216のことを言うそうです。

 

といっても、現在の環境では、ほとんどの色が表示できるようになっているため、

あまり気にしなくてもよいとか。

 

なお、こちらのページでセーフカラーを確認できます。

 

 

カラーコードページリンク

ということで、カラーコードで表現できる色は無限大... (いや、限りはあるか (笑))。

既存のサイトを参考にさせて頂くのが早いです。

いろいろ便利なサイトがあるので、リンク貼らせて頂きます。

 

★ カラーチャートとカラーピッカーが使いやすいサイト。

 

★ 色の名前も一緒に見ることができるサイト。分類が面白い。

なお、このページ、例えば、この色を選択した場合。

f:id:mikanusagi:20180615175738p:plain

コードをクリックして、、

 f:id:mikanusagi:20180615175816p:plain

 配色パターンを選択すると、、

f:id:mikanusagi:20180615192750p:plain

 いろいろな配色も表示してくれます。便利ですね。(*'▽')

 

 

★ ランダムにグラデーションを表示してくれるサイト。

 配色の参考になるかも。enterキーで、CSSコードも表示される。

 

 

 

では、今回はこのへんで (*'▽')/