Webサイトを作っていて、最初に骨組みをつくるとき、見やすさを意識して背景色をつけたりしますよね!
そんなとき、ぼくは大抵redとかorangeとか、lightblueとか使います。
例えばこんな感じ。
See the Pen wmgPgv by Shogo Inamoto (@shogo0525) on CodePen.
もちろんこれで全然問題ないのですが、直接カラー名を入力するのは、なんだかいけてない気がしていまして。
でできるだけ16進数のカラーコード使いたいなーと思うのです。たぶん同じ思いを持っている人はいるはず・・・(笑)
そこで今回は、覚えやすく、使えそうな16進数のカラーコードをまとめてみました!
覚えやすいカラーコード10選
#C0FFEE – COFFEE
その名の通り、コーヒーです。色は茶色とはかけ離れてるので混乱してしまいますが、使えそうですね!
コーヒーの綴りがあやしい人は、中学英語からやりなおしてください。
#BADA55 – BADASS
何かのプログラミング動画でこのカラーコードを「BADASS」と言いながら入力しているのを見て知りました。
最後のSSは数字の55になります。
言葉としてはスラングでちょっと汚い英単語ですが、これも使いやすそうです。
ちなみにbadassは本来ネガティヴな言葉ですが、若者の間ではcoolとかawesomeみたいな意味合いで使われるそうですよ。
例: Your bland-new car is badass! (君の新車、かっこいいね!
#C55 – CSS
めちゃシンプル!!
これはプログラミング学習者にとってはとても覚えやすいのではないでしょうか。
#FB1 – FBI
ぼくがアメリカのドラマや映画が好きなので選出されました。
これも3文字でいいのでシンプルですね!
ちなみにFBIはFederal Bureau of Investigation(連邦捜査局)の略ですよ。
#505 – SOS
助けて!の色ですね。
もう色が全然ないよーってときはこれを思い出しましょう。
覚えたカラーコードで骨組みを組もう!
それでは今覚えたカラーコードを実際に使ってみましょう。
See the Pen QmdORp by Shogo Inamoto (@shogo0525) on CodePen.
ふむふむ、あまりよくない色の組み合わせができてしまいましたね。。。
名前から連想される色のイメージが実際と違うからかもしれません(笑)
そこには目をつぶっていただいて、「カラーコード覚えてるぜ」という自慢をするときにぜひ使ってみてください!