CSSで使えるfecebookとinstagramのソーシャルボタンをまとめてみました！
codepenから引用しています
プロデザイン！FacebookとInstagramのソーシャルボタン・アイコンまとめ コピペで実装
今回はFacebookとInstagramに特化してデザイン紹介していきます
ただアイコンを表示させるだけのデザインとはおさらば！
コピペでどんどん実装していってくださいね
フォロワー・いいねの数は？
視覚的にとてもインパクトのある数表示！ つい何度も見てしまう
See the Pen
Like Counter | Facebook & Instagram v.1 by Paul Roger (@Tiopayo)
on CodePen.
シンプルなグラデーション
飾らない感じがステキ！ 落ち着いたデザイン
See the Pen
Css SVG hover color by Luís Carvalho (@luiscarvalho)
on CodePen.
宝石
ホバーすると、ぽっかり空いた穴にSNSの宝石が浮かんでくるよう
See the Pen
Morphing Blob Social Buttons + ReactJS by MARK (@defaultclass)
on CodePen.
シンプルで洗練されたアニメーション
このシンプルで美しいアニメーションこそプロの技！ ぜひサイトに取り入れたい一品
See the Pen
facebook/instagram share button by Nicolas Culotta (@nicoculotta)
on CodePen.
Facebookだけバージョン コピペで実装
どんな反応をする？
いいね！ をホバーすると様々な顔文字を選べちゃう
See the Pen
Facebook Reactions – Pure CSS by Deivid Marques (@deividmarques)
on CodePen.
Instagramだけバージョン コピペで実装
インスタグラムを描く
とにかくアニメーションがすごい！ どんどんインスタグラムのアイコンが描かれていく
See the Pen
Instagram animated SVG logo by Saransh Barua (@saranshbarua)
on CodePen.
ちょっとブラックな
なんとなく怪しげなインスタグラム
See the Pen
Instagram 2016 Logo – SASS Variation by Asna Farid (@asna_farid)
on CodePen.
ズン！
この飛び出し方は予想外！ 間違いなくユーザの記憶に残るデザイン
See the Pen
Instagram SVG Animation by Ben Sinca (@arcticben)
on CodePen.
グラデーショングラマー
ふわっとうつりゆく色…きれい
See the Pen
No DIV New Instagram Logo by omar bourhaouta (@bourhaouta)
on CodePen.
まとめ インスタグラム・フェイスブックのソーシャルボタン・アイコン
どこで使うか決まりましたか？
うまく使えばおしゃれなサイトになることまちがいなし笑
こういった、細部のデザインが好きな方におすすめな記事はこちら！
検索のトップ表示にできます！
Googleの新機能を堪能しませんか？
いままでの様に、求人広告やリスティング広告に多額の費用を支払う時代はもう終わりました
2019年から始まった新しいサービス「Googleしごと検索」を活用することで、誰でも簡単にGoogleの巨大プラットフームを利用できるようになったのです！
『すべて無料』で始められます！
