오랜만에 깃허브 리드미 꾸미기를 하다가 기술스택 부분을 작성해보고져서 서치를 하던 중 괜찮은 것을 발견해서 공유합니다!
결과물은 위와 같아요. 8가지 정도 추가해봤는데, 예쁜 것 같아요.
위 이미지처럼 기술 스택을 뱃지형태로 만드는 방법이 제일 많이 쓰는 방법인 것 같은데요.
저는 이것 말고, 좀 더 둥글둥글하고 로고가 더 돋보이는 디자인을 원했어요!
마침 편리하게 추가할 수 있는 기능을 제공하는, 레포지터리를 찾을 수 있었는데요.
바로 skill-icons 입니다.
사용법
사용법은 간단합니다.
[](https://skillicons.dev)
위 코드를 Github README 에 복붙하기만 하면 되는데요.
icons?i=[원하는 아이콘 이름들] 을 띄어쓰기 없이 , (쉼표)로 구분해서 작성해주시면 됩니다.
테마가 적용된 아이콘 넣기
[](https://skillicons.dev)
아이콘마다 어두운 테마/ 밝은 테마가 있는 경우가 있는데요.
(기본 테마는 default 로 어두운 테마라고 하네요)
&theme=light 를 추가로 위와같이 작성해주면 밝은 테마를 적용할 수 있습니다.
한 줄에 아이콘 갯수 제한(여러줄로 보여주기)
이 아이콘들 처럼 여러줄에 걸쳐서 아이콘들을 보여주고 싶다면 아래와 같이 작성해줍니다.
&perline=3 을 추가해서, 한 줄에 3개씩만 출력이 되도록 제한을 걸었어요.
[](https://skillicons.dev)가운데 정렬된 아이콘
아이콘을 중앙으로 정렬해서 배치하고 싶다면 p 태그를 이용하면 됩니다.
아래의 코드를 참고해주세요.
<p align="center">
<a href="https://skillicons.dev">
<img src="https://skillicons.dev/icons?i=git,kubernetes,docker,c,vim" />
</a>
</p>
모든 아이콘 종류 찾기
icons 의 종류는 아래에서 찾을 수 있어요.
https://github.com/tandpfun/skill-icons?tab=readme-ov-file#icons-list
GitHub - tandpfun/skill-icons: Showcase your skills on your Github readme or resumé with ease ✨
Showcase your skills on your Github readme or resumé with ease ✨ - tandpfun/skill-icons
github.com
더 자세한 정보는 아래 skill-icons 의 github repository 를 확인해주세요. ⬇️
https://github.com/tandpfun/skill-icons?tab=readme-ov-file#readme
GitHub - tandpfun/skill-icons: Showcase your skills on your Github readme or resumé with ease ✨
Showcase your skills on your Github readme or resumé with ease ✨ - tandpfun/skill-icons
github.com
포스팅 읽어주셔서 감사합니다~
