[Github] Readme.md 스킬, 라이브러리 배지 삽입 방법
배지 삽입하는 방법
배지는 깃허브 readme.md 에서 많이 볼 수 있는, SkillSet 표시나 사용한 라이브러리를 시각적으로 표시할 때 많이 사용한다.
배지 API를 제공하고 있는 shields.io 를 이용해서, 이미지 파일 없이 readme 를 작성할 수 있는 방법을 소개한다.
Static Badge | Shields.io
One of the named logos (bitcoin, dependabot, gitlab, npm, paypal, serverfault, stackexchange, superuser, telegram, travis) or simple-icons. All simple-icons are referenced using icon slugs. You can click the icon title on simple-icons to copy the slug or t
shields.io
(Document 에서 자세한 사용법을 참고할 수 있다.)
소스 코드
HTML 이미지 태그를 이용한다. 다음은 기본 코드이다.
<img src="https://img.shields.io/badge/배지이름-배지배경색?
style=배지모양
&logo=로고이름
&logoColor=로고색상"/>
로고 이름, 로고 색상 등을 볼 수 있는 Simple Icons 사이트를 이용해서 완성한다.
Simple Icons
3014 Free SVG icons for popular brands
simpleicons.org
예시) Python
1. 배지 이름, (배지 이름)
Python(원하는 이름)
2. 배지 배경색
#3776AB(복붙) 에서 #을 제거하고 사용해야한다 > 3776AB
3. 로고 이름(&logo)
Python (복붙)
4. 배지 모양 (plastic, flat, flat-square, for-the-badge, social 중 선택)
for-the-badge
<img src="https://img.shields.io/badge/Python-3776AB?
style=for-the-badge
&logo=Python
&logoColor=white"/>