SVG と背景色を使ってサイズやカラーが自在な汎用性のあるアイコンボタンを作る

テクノロジーカテゴリーの変更を依頼記事元:

hyper-text.org

21 usersがブックマークコメント

コメント

2

記事へのコメント2件

注目コメント
新着コメント

nakagaw “ブランドロゴ配布”

CSS3

2014/08/01 リンク

pon_dad webフォント作るより楽かも

2014/02/19 リンク

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

規約違反を報告

アプリのスクリーンショット

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

関連記事

SVG と背景色を使ってサイズやカラーが自在な汎用性のあるアイコンボタンを作る

SVG によるアイコンデータと CSS による背景色の指定を組み合わせてサイズやカラーを自在に変更可能なア... SVG によるアイコンデータと CSS による背景色の指定を組み合わせてサイズやカラーを自在に変更可能なアイコンボタンを作るお話。あわせて主要 Web サービスのロゴデータを SVG で用意する方法や注意点なども。透過 GIF や PNG 画像に背景色を組み合わせることでアイコンボタンのカラーバリエーションを簡単に作るっていうやり方は昔からありますが、これを SVG （Scala ble Vector Graphics）でやることでサイズ変更にも対応しやすいやつを作るっていうお話。手法的には目新しいことは何もありませんが、この前この Blog のデザインをリニューアルしたときに視覚的に左側サイドメニュー上部（スマートフォン表示だと隠れてると思いますが）にある「Follow」メニュー部分で使ったので紹介。やってることは簡単です。白抜きにしたい部分をそのまま白色、背景は透過するよ

ブックマークしたユーザー

nayo742015/02/17
fugashi2014/08/27
nakagaw2014/08/01
hikabu2014/06/12
lEDfm4UE2014/03/21
d4-19772014/02/21
tyto2014/02/20
k_ume752014/02/20
maritimecolor2014/02/20
akira_maru2014/02/20
dhrname2014/02/19
info552014/02/19
mura242014/02/19
s-kic2014/02/19
noplans2014/02/19
pon_dad2014/02/19
nana_072014/02/19
kyaido2014/02/19

同じサイトの新着

同じサイトの新着をもっと読む

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

設定を変更しましたx