Skip to content

Skill Icons

Generates a row of skill icons (languages, tools, frameworks) to embed in a GitHub README or resume.

Stars
13.4k
Forks
1.7k
Licence
MIT
Language
SVG
Last update
8 months ago
Type
Other

What it is

Skill Icons is a web service that builds an image of technology logos from a list you provide in a URL, such as js,html,css. You paste the generated image link into your GitHub profile README or a resume to show your skills at a glance. The README says the service runs on Cloudflare Workers and that the icon set is maintained by the project, not user submissions.

  • Add a clickable skills badge row to your GitHub profile README using the example URL pattern
  • Change the theme to light with &theme=light for a light README background
  • Set the number of icons per line with &perline= (1 to 50, default 15)
  • Center the icon row in a README using standard HTML image centering

Great for

  • Developers who want a visual skills section on their GitHub profile README
  • Students or job seekers adding a skills banner to an online resume
  • People who only need a quick embed without building or hosting anything

Not ideal for

  • Anyone who needs to host the images on their own infrastructure, since the README describes using the hosted skillicons.dev URL and does not document self-hosting
  • People who want an icon for a technology not on the list, because the README says new icons are added only by opening an issue, not by pull request
Step-by-step guide: how to use Skill IconsInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Use it in the browser (or self-host)

    Use the hosted service (no install needed) by pasting this into your README

    [![My Skills](https://skillicons.dev/icons?i=js,html,css,wasm)](https://skillicons.dev)
  2. 2

    Run it

    • Open the Icons List in the README and pick the icon IDs you want.
    • Copy the markdown snippet and replace the ID list after i= with your own, separated by commas.
    • Paste the snippet into your GitHub profile README or resume and view the result.
  3. 3

    Get the most out of it

    • Use &theme=light for light-background readmes, since some icons have separate dark and light variants
    • Use &perline= to control the layout width, with values from 1 to 50
    • Wrap the image in a p align=center block to center it, since the SVGs resize automatically

Downloads

Strengths

  • Setup is a single pasted link with no installation required
  • The README documents the URL parameters for icons, theme, and icons per line
  • Released under the MIT license

Trade-offs

  • New icons can only be requested through an issue, and the README says pull requests for icons are not accepted
  • Depends on the hosted service at skillicons.dev being available

How it compares

ProjectStarsTypeLevelUpdatedBest for
skill-icons (this)13.4kOtherbeginner8 months agoDevelopers who want a visual skills section on their GitHub profile README
github-readme-stats79.9kDev toolbeginner1 months agoPeople who want a generated stats card on their GitHub profile README
feather26kLibrarybeginner1.7 years agoWeb developers who want a clean set of line icons without designing their own
tabler-icons22.5kAppbeginner7 days agoWeb developers who need a consistent set of icons for buttons, menus, and dashboards
ionicons18.2kLibrarybeginner3 months agoDevelopers building apps with Ionic Framework, where icons are already packaged
metrics17.4kDev toolintermediate5 months agoDevelopers who want an automatically updated stats card on their GitHub profile README

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.