![](./.github/text-logo.svg#gh-dark-mode-only)
![](./.github/text-logo-light.svg#gh-light-mode-only)
Showcase your skills on your GitHub or resumé with ease!
Powered by Cloudflare Workers ⚡
NOTE: To keep icons consistent and to ensure browser support, we don't accept pull requests for icon submissions. If you would like an icon added, please open an issue.
# Docs
- [Example](#example)
- [Specifying Icons](#specifying-icons)
- [Themed Icons](#themed-icons)
- [Icons Per Line](#icons-per-line)
- [Centering Icons](#centering-icons)
- [Icons List](#icons-list)
# Example
![](./.github/example-dark.png#gh-dark-mode-only)
![](./.github/example-light.png#gh-light-mode-only)
# Specifying Icons
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 seprated by ","s! You can find a full list of icons [here](#icons-list).
```md
[![My Skills](https://skillicons.dev/icons?i=js,html,css,wasm)](https://skillicons.dev)
```
[![My Skills](https://ikyih.github.io/more-spsific-skill-icons/icons?i=AS2,Sketch)
# Themed Icons
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:**
```md
[![My Skills](https://skillicons.dev/icons?i=java,kotlin,nodejs,figma&theme=light)](https://skillicons.dev)
```
[![My Skills](https://skillicons.dev/icons?i=java,kotlin,nodejs,figma&theme=light)](https://skillicons.dev)
# Icons Per Line
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.
```md
[![My Skills](https://skillicons.dev/icons?i=aws,gcp,azure,react,vue,flutter&perline=3)](https://skillicons.dev)
```
[![My Skills](https://ikyih.github.io/more-spsific-skill-icons/icons?i=AS2,Sketch)]([https://ikyih.github.io/more-spsific-skill-icons]
# Centering Icons
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.
```html
```
# Icons List
Here's a list of all the icons currently supported.
| Icon ID | Icon |
| :----------------: | :---------------------------------------------------: |
| `AS2` |
![](./icons/AS2.svg)
|
| `AS3` |
![](./icons/AS3.svg)
|
| `Sketch` |
![](./icons/Sketch.svg)
|
---