- Docs
- Example
- Specifying Icons
- Themed Icons
- Icons Per Line
- Get Icons Names
- Centering Icons
- Icons List
- 💖 Support the Project
Copy and paste the code block below into your readme to add the skills icon element!
Change the ?i=js,html,css
to a list of your skills separated by ","s! You can find a full list of icons here.
![My Skills](https://go-skill-icons.vercel.app/api/icons?i=js,html,css,wasm)
Some icons have a dark and light themed background. You can specify which theme you want as a url parameter.
This is optional. The default theme is dark.
Change the &theme=light
to either dark
or light
. The theme is the background color, so light theme has a white icon background, and dark has a black-ish.
Light Theme Example:
![My Skills](https://go-skill-icons.vercel.app/api/icons?i=java,kotlin,nodejs,figma&theme=light)
You can specify how many icons you would like per line! It's an optional argument, and the default is 15.
Change the &perline=3
to any number between 1 and 50.
![My Skills](https://go-skill-icons.vercel.app/api/icons?i=aws,gcp,azure,react,vue,flutter&perline=3)
You can get the possiblity to add the name of the icons you put to help others that doesnt know what they are by using &titles
.
The value of titles
is a boolean, so it should be true
or false
, default is false
![My Skills](https://go-skill-icons.vercel.app/api/icons?i=rust,surrealdb,actix,yew&titles=true)
Want to center the icons in your readme? The SVGs are automatically resized, so you can do it the same way you'd normally center an image.
<p align="center">
<a href="https://go-skill-icons.vercel.app/">
<img
src="https://go-skill-icons.vercel.app/api/icons?i=git,kubernetes,docker,c,vim"
/>
</a>
</p>
Thank you so much already for using my projects! To support the project directly, feel free to open issues for icon suggestions, or contribute with a pull request!