SNSなどのカラーコードとアイコンフォントまとめ

2019-02-26ColorSNS,アイコンフォント,ブランドカラー

 

Twitter・Facebook・LINE・Instagram・YouTube・Tumblr・LinkedIn・はてなブックマーク・feedly・RSS・mixi・Skype・Dropbox・Vimeo・Yahoo・Amazon・楽天・WordPress・Google・windows・android・HTML5・css3

 

その他のカラーコード

 ブランドカラー

SNS等企業ネットショップオリンピックプロ野球MLBJリーグ競輪・競馬地下鉄私鉄(1)私鉄(2)JR新幹線国旗

 色別カラーコード

マカロンビビッドパステル伝統色和色セーフ色名配色パターンサンプル

 

ブログやサイト構築で何かにつけ、色やアイコンフォントを探す機会の多いブランドカラーのカラーコードと、アイコンフォントのコードをまとめました。
アイコンフォントは「Font Awesome」のフリーフォントです。

Font Awesomeアイコンフォントの使い方については以下をご覧ください。

表の見方

各コードは以下の通り、上段がカラーコード、下段がアイコンフォントのコードです。

アイコンフォント ブランド名
16進カラーコードRGBカラーコード
UnicodeHTML

 

SNS関連・ツール

 Twitter
#55aceergb(85, 172, 238)
f099
<i class="fab fa-twitter"></i>
  Facebook
#315096rgb(49, 80, 150)
f09a
<i class="fab fa-facebook"></i>
f39e
<i class="fab fa-facebook-f"></i>
 LINE
#00c300rgb(0, 195, 0)
f3c0
<i class="fab fa-line"></i>
 Instagram
#405de6rgb(64, 93, 230)
#5851dbrgb(88, 81, 219)
#833ab4rgb(131, 58, 180)
#c13584rgb(193, 53, 132)
#e1306crgb(225, 48, 108)
#fd1d1drgb(253, 29, 29)
#f56040rgb(245, 96, 64)
#f77737rgb(247, 119, 55)
#fcaf45rgb(252, 175, 69)
#ffdc80rgb(255, 220, 128)
f16d
<i class="fab fa-instagram"></i>
 YouTube
#ff0000rgb(255, 0, 0)
#282828rgb(40, 40, 40)
f173
<i class="fab fa-youtube"></i>
 Tumblr
#35465crgb(53, 70, 92)
f173
<i class="fab fa-tumblr"></i>
 LinkedIn
#0077b5rgb(0, 119, 181)
f08c
<i class="fab fa-linkedin"></i>
 はてなブックマーク
#008fdergb(0, 143, 222)
 feedly
#2bb24crgb(43, 178, 76)
 RSS
#f26522rgb(242, 101, 34)
f09e
<i class="fab fa-rss"></i>
 f143
<i class="fab fa-rss-square"></i>
 mixi
#d1ad59rgb(209, 173, 89)
 Skype
#00aff0rgb(0, 175, 240)
f17e
<i class="fab fa-skype"></i>
 Dropbox
#007ee5rgb(0, 175, 240)
f16b
<i class="fab fa-dropbox"></i>
 Vimeo
#1ab7eargb(26, 183, 234)
f40a
<i class="fab fa-vimeo"></i>
Pocket
#ef4056rgb(239, 64, 86)
#50bcb6rgb(80, 188, 182)

 

ネットショップ

 Yahoo
#410093rgb(65, 0, 147)
f19e
<i class="fab fa-yahoo"></i>
 Amazon
#ff9900rgb(255, 153, 0)
#146eb4rgb(20, 110, 180)
f270
<i class="fab fa-amazon"></i>
 楽天
#bf0000rgb(191, 0, 0)

 

その他

 WordPress
#21759brgb(33, 117, 155)
#d54e21rgb(213, 78, 33)
#464646rgb(70, 70, 70)
f19a
<i class="fab fa-wordpress"></i>
 Google
#4285f4rgb(66, 133, 244)
#34a853rgb(52, 168, 83)
#fbbc05rgb(251, 188, 5)
#ea4335rgb(234, 67, 53)
f1a0
<i class="fab fa-google"></i>
 windows
#0078d7rgb(0, 120, 215)
#ffb900rgb(255, 185, 0)
#e81123rgb(232, 17, 35)
#107c10rgb(16, 124, 16)
f17a
<i class="fab fa-windows"></i>
 android
#a4c639rgb(164, 198, 57)
f38b
<i class="fab fa-android"></i>
 HTML5
#e34f26rgb(227, 79, 38)
f13b
<i class="fab fa-html5"></i>
 css3
#e34c26rgb(227, 76, 38)
f38b
<i class="fab fa-css3-alt"></i>

関連記事