変更したい場合は、ImageMagickで一括変換すると便利です。
今回のデータは、以下のサイトからダウンロードしました。
http://2pt3.com/news/twotone-icons-for-free/
元画像(cart.psd, cart.gif)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaZiWfxNLqLThRG_l0Auo5ROi2EwEU7l63eJQ6nDNltguIY7ExQWcrgMi-7TYjBxwFJYnB-eHJjA0n3Prr3NYx2JnJKcgwX7sTrIpuBnN1JQcScHUqA7f8LzYUoHpJMXSAc0Pg/s320/cart.gif)
配布データがPhotoshopのデータ(*.psd)だった場合は、レイヤーごとにページが
作られるので必要ないレイヤーは削除したのち白色を任意の色に変更します。
(ちなみに、このデータの場合、カートのビットマップが書かれているレイヤーの
サイズが12x12なので16x16に変更しています。)
rem 環境によって変えてねset im=C:\Progra~1\ImageMagick-6.3.2-Q16
%im%\convert.exe cart.psd -delete 0 -delete 0 -background none -gravity center -extent 16x16 +repage -fx "p==#FFFFFFFF?#FAD759FF:#00000000" -background white cart.png
出力画像(cart.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFR8su4Elv0wKKS_hHGc7PcSzmE3jXosSvNFd3b7d7bOt_UzrzdLmDj_k28EO6uw87kiYmbagMelzSyb2mX1GOzvKF-F19pcDHDMuXv11ATe8JQzscNMoKyuMpFHxfyQPs3WCv/s320/cart.png)
psdのアイコン画像の白色をグラデーションで塗り替える場合は、以下のコマンドを実行します。
%im%\convert.exe cart.psd -delete 0 -delete 0 -background none -gravity center -extent 16x16 +repage ( -size 16x16 gradient:#80ffff-#e0ff80 ) -compose src_in -background white -composite cart2.png
出力画像(cart2.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdT9d_O8wzBAJ6SoDeIspkgx5raxwAHRKt7VPJbYRLpibnEdIl9yB2V6kkchAW-EHdRUO64_ZABpELzxKcSt-eUHwcs5KlBczuzPPOJkKI3Z3VQfpLh4-X5zb92klQDW9m7nTC/s320/cart2.png)
元データが透過gifの場合は、透明色をいったん別の色で塗り替え後、
白色を任意の色で塗りつぶし、それ以外を透明色とします。
%im%\convert.exe cart.gif -channel RGBA -fx "p.a==0?#0000EEFF:p" -channel RGBA -fx "(p.r==1 && p.g==1 && p.b==1)?#FAD759FF:#00000000" cart3.png
出力画像(cart3.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOWa0DfECaoaa791bzmFU7DKr63l33LmRjIFF7ao6ek2PjzOjA8XEGB1yxzANs5FG-CvjunYyByxpO8JwmM92YQnv3loiQTp8ETZX7nPs8vB0WaWlbG9TZAVevQsE73xjd5a54/s320/cart3.png)
gifアイコン画像の白色をグラデーションで塗りつぶす場合は、いかのコマンドを実行します。
%im%\convert.exe cart.gif -channel RGBA -fx "p.a==0?#0000EEFF:p" -channel RGBA -fx "(p.r==1 && p.g==1 && p.b==1)?#FFFFFFFF:#00000000" ( -size 16x16 gradient:#80ffff-#e0ff80 ) -compose src_in -composite cart4.png
出力画像(cart4.png)
No comments:
Post a Comment