skill-icons 技能图标速成指南：3 个 URL 参数把 GitHub 文字墙变成图标墙

【免费下载链接】skill-iconsShowcase your skills on your Github readme or resumé with ease ✨项目地址: https://gitcode.com/gh_mirrors/sk/skill-icons

简历改好了，可招聘官打开你的 GitHub 主页，技术栈还是一段干巴巴的文字罗列，扫一眼就被划走——这个翻车瞬间不少人经历过。skill-icons 是一个开源技能图标墙项目：往 README 里粘贴一行代码，你的技术栈就会实时渲染成彩色图标墙，三秒让对方 get 到你的全部实力。

能力边界速览

它不是一个本地图标库，而是由 Cloudflare Workers 驱动的动态渲染服务：贴一行代码，实时返回一张即用的 SVG。不用注册账号、不下载图片、不部署服务器，能力边界如下：

图 1：skill-icons 深色主题图标墙，彩色图标在深色背景下对比鲜明

skill-icons 上手路径：从文字墙到图标墙

锁定你的技能 ID。每个技能都有唯一 ID：JavaScript 是js、Python 是py、Docker 直接写docker。完整清单见 readme.md 底部的对照表，也可以直接翻 icons/ 目录按文件名对照。

拼出渲染链接。把需要的 ID 用英文逗号分隔，塞进i=参数后，再包一层 markdown 图片语法：

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

贴进 README 并刷新。提交后一排深色背景的 skill-icons 技能图标就出现了，后续增删图标时 SVG 高度会自动重算，无需手动改尺寸。

默认深色底适合暗黑风主页；如果你走浅色路线，在链接后追加&theme=light，图标墙就换白色底：

图 2：skill-icons 亮色主题图标墙，与白色页面自然融合

skill-icons 主题切换与排版调参

切换深浅主题。适用场景：主页整体是浅色时，默认黑底会显得突兀。关键参数：&theme=light或&theme=dark，只接受这两个值。实际效果：图标背景换成白底，自然融入浅色页面，图标本身的配色不变。

[![My Skills](https://skillicons.dev/icons?i=java,kotlin,nodejs&theme=light)](https://skillicons.dev)

控制每行数量。适用场景：图标一多，默认单行排布就显得松散。关键参数：&perline=3，取值 1 到 50，不填默认 15。实际效果：图标自动换行，图标墙更短、更聚焦核心技能。

居中展示图标墙。适用场景：想让它正位居中挂在主页上。关键参数：用<p align="center">标签包裹链接即可。实际效果：渲染结果本身就是一张图片，按普通图片的居中方式处理就行。

短别名少敲键盘。适用场景：全称太长，链接看得眼花。关键参数：js→javascript、py→python、k8s→kubernetes、next→nextjs 等内置别名。实际效果：链接更短，日后维护改起来更省心。

想再往深里定制配色，可用git clone https://gitcode.com/gh_mirrors/sk/skill-icons把仓库拉到本地，所有 SVG 源文件都在icons/目录里。

不同身份怎么用：场景对号入座

当你是求职中的后端工程师。图标墙直接放在简介正下方，?i=java,spring,mysql,redis,docker,kafka&theme=dark，岗位关键词排在第一排，面试官扫一眼就能确认匹配度。

当你是全栈开发者。别堆在一起，按领域拆三组分别生成：前端?i=react,vue,ts,tailwind、后端?i=nodejs,go,postgres、工具?i=docker,git,linux,vscode，组间用分隔线隔开。

踩坑前先看这里：高频问题一句话解决

• 图标加载慢 → 控制单次渲染的数量，或本地克隆仓库部署，彻底脱离外部依赖
• 想改图标配色 → 全部是 SVG 矢量文件，本地克隆后用任意 SVG 编辑器改即可
• 图标墙出不来 → 检查i参数里有没有中文逗号或多余空格，theme只接受 dark 与 light
• 不确定默认值 → 主题默认 dark，perline默认每行 15 个、上限 50
• 想新增图标 → 项目不接受直接提交图标的 PR，提一个 issue 说明你需要的技能，由维护者评估后添加

去 README 里贴上第一行代码吧，三分钟的改动，长期受益 🚀

【免费下载链接】skill-iconsShowcase your skills on your Github readme or resumé with ease ✨项目地址: https://gitcode.com/gh_mirrors/sk/skill-icons