ハートアイコン公開
News
【素材を探す】にてハートアイコン(幅&高さ:20px/40px/80pxのスリーサイズ)を、塗りつぶし(黒/ピンク)・白抜き(黒/ピンク)の4種類公開しました。
(黒:#2a2a2a/ピンク:#ff5555です)
なお透過pngです。gifだと白背景以外で画像汚くなるので……。
![](https://alicex.jp/sozai/93/3.png)
![](https://alicex.jp/sozai/94/3.png)
![](https://alicex.jp/sozai/95/3.png)
![](https://alicex.jp/sozai/96/3.png)
今更思い出したんですが、これ黒背景用に『白』のカラーバリエも用意すべきでしたね……。しかし素材を探すに白い透過png置くと見えないからなぁ……。
素材公開ページできたら作ります……。
今回は加工・再配布無制限でお好きにどうぞの画像なので、必要なときは加工して頂く感じですみませんお願いします。
で、これは小説機能にも「いいね!」ボタンが実装されたことに伴い作ったアイコンだったりします。
今現在の当WEブログノートいいねがこれを使ったデザインです。↑はサンプルなので押してもカウント進みませんが、対応端末からだとオンマウス or タップでハートがくるくる回って黒からピンクに変わるアニメーションがあります。
それとこの画像はn×nの正方形にしたかったのですが、正方形にみっちりハート描いたらなんか可愛くなかったので、「画像のサイズは正方形、ハートはやや横長(=上下にちょっと隙間がある)」状態です。
ハートの上に文字を重ねる関係上、偶数pxの正方形が一番楽かなと……。
こういう感じです。
(黒:#2a2a2a/ピンク:#ff5555です)
なお透過pngです。gifだと白背景以外で画像汚くなるので……。
![](https://alicex.jp/sozai/93/1.png)
![](https://alicex.jp/sozai/93/2.png)
![](https://alicex.jp/sozai/93/3.png)
![](https://alicex.jp/sozai/94/1.png)
![](https://alicex.jp/sozai/94/2.png)
![](https://alicex.jp/sozai/94/3.png)
![](https://alicex.jp/sozai/95/1.png)
![](https://alicex.jp/sozai/95/2.png)
![](https://alicex.jp/sozai/95/3.png)
![](https://alicex.jp/sozai/96/1.png)
![](https://alicex.jp/sozai/96/2.png)
![](https://alicex.jp/sozai/96/3.png)
今更思い出したんですが、これ黒背景用に『白』のカラーバリエも用意すべきでしたね……。しかし素材を探すに白い透過png置くと見えないからなぁ……。
素材公開ページできたら作ります……。
今回は加工・再配布無制限でお好きにどうぞの画像なので、必要なときは加工して頂く感じですみませんお願いします。
で、これは小説機能にも「いいね!」ボタンが実装されたことに伴い作ったアイコンだったりします。
今現在の当WEブログノートいいねがこれを使ったデザインです。↑はサンプルなので押してもカウント進みませんが、対応端末からだとオンマウス or タップでハートがくるくる回って黒からピンクに変わるアニメーションがあります。
それとこの画像はn×nの正方形にしたかったのですが、正方形にみっちりハート描いたらなんか可愛くなかったので、「画像のサイズは正方形、ハートはやや横長(=上下にちょっと隙間がある)」状態です。
ハートの上に文字を重ねる関係上、偶数pxの正方形が一番楽かなと……。
![](https://alicex.jp/sozai/94/3.png)