はじめに
この画像かわいいですよね!!
まだまだですが,ポートフォリオ作るときにQiitaのリンクをはろうと思ったのです.
ただ,公開されてるのがこれだけなので,とりあえず,貼るのにちょうどいい画像に変換してから,乗っけました.
3Dペイントとかも使えるみたいですがよくわからなかったのでpythonで画像加工のプログラムを書きました.
たぶん大丈夫だと思うのですが,これがガイドライン的にアウトだったら教えてください
早急に消します
pythonプログラム
import cv2
import numpy as np
from PIL import Image, ImageDraw, ImageFilter,ImageOps,ImageChops
# 元画像を読み込み最大値を255,最小値を0にする
im_gray = cv2.imread('qiita-icon.png', cv2.IMREAD_GRAYSCALE)
imtype = im_gray.dtype
im_gray -=np.min(im_gray)
valmax = 255 / np.min(im_gray)
im_gray = im_gray * valmax
# 白黒反転
im_gray = 255 - im_gray
#型変換してしまうので元に戻す
im_gray = im_gray.astype(imtype)
#Image型に変換
img_p = Image.fromarray(im_gray)
# 黒画像を作り,アルファ値の設定
im_a = Image.new("RGB", img_p.size, (0,0,0))
im_a.putalpha(img_p)
crop = im_a.split()[-1].getbbox()
im_a.crop(crop)
im_a.save('qiita-icon.png')
htmlへの実装
html
<div class="btnce">
<a href="https://qiita.com/#" class='btn'><img class="qiiicon" src="img/qiita-icon.png"/> Qiita</a>
</div>
css
.qiiicon{
height: 1rem;
width: auto;
filter: invert(100%);
}
filterで色を変えたことくらい
他の色のやり方はafterとかなのでしょうか?
うまくいかなかったです
やり方知りたい...
結果
こんな感じになりました
まあまあいい感じにはなったと思うので及第点とします
少しずれてるのでアドバイスあればお願いします