소개

이 이미지는 귀엽다! !
아직은 있지만 포트폴리오 만들 때 Qiita의 링크를 풀려고 생각했습니다.
다만, 공개되고 있는 것이 이것뿐이므로, 우선, 붙이는데 딱 좋은 화상으로 변환하고 나서, 태웠습니다.
3D 페인트라고도 사용할 수 있는 것 같습니다만 잘 모르기 때문에 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라고 할까요?
작동하지 않았다.
방법을 알고 싶습니다 ...

결과

이런 느낌이 들었습니다.
글쎄, 좋은 느낌이 들었다고 생각하기 때문에 문제점이 있습니다.
조금 어긋나 있기 때문에 조언이 있으면 부탁드립니다.

참조

브랜드 가이드
🖼 【CSS】 filter만을 사용하여 검은 이미지를 임의의 색상으로 변경