리드미 꾸미기 (뱃지 편)

리드미는 마크업 언어를 이용하여 작성함

html에서 사용하는 <h1></h1>   <a></a>   <div></div> 등의 태그를 쓸 수 있다

width와 같이 속성들을 이용해서 사이즈를 조절할 수 있다

 

뱃지 사용 방법

언어나 기술 스택등을 가시적으로 표현하고 싶을 때

사용하는 SNS를 링크로 연결 가능

 

공식 로고 색상과 이름을 담은 사이트

https://simpleicons.org/

Simple Icons

 

<img src="https://img.shields.io/badge/이름-색상코드?style=flat&logo=로고명&logoColor=white"/>

//python
<img src="https://img.shields.io/badge/Python-3776AB?style=flat&logo=Python&logoColor=white"/>

이름에는 뱃지에 표시할 내용을

색상코드는 #를 제외한 부분을

로고명에는 아이콘 이름을

로고색에는 로고의 색을 담는다 (대부분 흰색이면 검은색으로, 나머지는 흰색으로 설정한다) 

 

뱃지에 링크 걸기

<a href="링크"><img src="위에있는뱃지코드"/></a>
//
<a href="https://github.com/WooJungE/WooJungE"><img src="https://img.shields.io/badge/Github-181717?style=flat&logo=Github&logoColor=white"/></a>

 

 

 

 

참고자료

https://velog.io/@seondal/Github-Readme-꾸미기-총정리

Github Readme 꾸미기 총정리 🎨