- 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>
Here's a list of all the icons currently supported. Feel free to open an issue to suggest icons to add!
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!