skill-icons 5大核心参数终极教程i/theme/perline/titles/align 一网打尽【免费下载链接】skill-iconsFork of official skill-icons repository. Showcase your skills on your Github readme or resumé with ease ✨项目地址: https://gitcode.com/gh_mirrors/skil/skill-icons想让你的 GitHub README 或个人简历瞬间拥有专业感十足的技术栈展示墙吗skill-icons正是为此而生的开源项目它无需安装任何插件只需一段简单的图片标签就能把几十上百个技能图标整齐地排列出来。而决定展示效果的全部秘密就藏在i、theme、perline、titles、align这 5 大核心参数里。这篇 skill-icons 参数详解教程将带你一次吃透全部玩法轻松打造高颜值的技能展示区。skill-icons 是什么GitHub README 技能展示利器skill-icons 是官方 skill-icons 仓库的一个完整 Fork镜像核心思路是以 URL 参数驱动、即时生成 SVG 图标墙。你在 README 中放入一行图片地址服务端就会根据参数动态拼装出一张技能图标图片无需本地部署、无需构建粘贴即用非常适合新手快速上手。上图就是 skill-icons 在深色背景下的实际效果三行网格、图标整齐划一、品牌色清晰醒目。下方这张则是浅色主题下的同款展示两种风格均可一键切换。参数一i —— 用一行代码指定你的技能清单i是 skill-icons 中最核心、也最基础的参数它决定了展示哪些技能。用法非常简单把图标名称用英文逗号,分隔拼在?i后面即可几点实用技巧支持简写名称不必死记全名js、ts、py、go、k8s、next等短名均可直接使用系统会自动映射到完整图标详见 api/index.go 中的短名映射表。一次展示全部想炫技把i设为all即可一次性输出当前版本支持的所有技能图标。数量不限图标列表可以很长配合下方的perline参数控制排版即可。参数二theme —— 深色与浅色主题一键切换theme参数控制图标的背景色专为适配不同风格的 README 设计theme 取值效果auto自动跟随系统 / GitHub 主题默认值dark深色图标背景适合暗色系 READMElight浅色图标背景适合明亮系 README快速配置建议如果你的 README 同时兼容深浅两种模式直接使用默认的auto即可skill-icons 会像上面的示例图一样自动适配省心又稳妥。参数三perline —— 灵活控制每行图标数量perline参数决定每行放几个图标取值范围为1 到 50默认每行 15 个。当图标数量较多时适当调小perline可以避免图片过于细长最佳实践图标少于 10 个建议用perline5左右图标很多时控制在 10~15 个每行视觉最舒服。该参数在服务端会实时计算图片宽高见 api/index.go因此怎么改都不会变形。参数四titles —— 显示图标名称让读者一目了然默认情况下图标只有图形、没有文字。titles参数设为true后每个图标都会附带对应的技能名称提示对不了解某些冷门工具 logo 的读者非常友好titles是布尔参数只需填true或false默认false。建议在简历、作品集这类正式场景中开启能显著提升可读性与专业度。参数五align —— 图标对齐方式随心调align参数控制整张图标墙的水平对齐方式支持三种取值align 取值对齐效果适用场景left左对齐默认常规文档流center居中对齐简历、个人主页居中排版right右对齐特殊版式设计配合 HTML 标签即可实现居中的完整方案例如p aligncenter img srchttps://go-skill-icons.vercel.app/api/icons?igit,kubernetes,docker,c,vim / /p5 大参数组合实战打造终极技术栈展示掌握了全部参数后组合使用才能发挥最大威力。下面是一段浅色主题 每行 4 个 显示名称的实战示例小贴士如果某个参数填写错误比如theme写成其他值、perline超出 1~50 范围接口会返回明确的错误提示按提示修正即可。本地部署与更多玩法如果你希望完全掌控服务、不依赖公共接口也可以把整个 skill-icons 仓库克隆到本地自行部署git clone https://gitcode.com/gh_mirrors/skil/skill-icons项目基于 Go 编写核心路由与参数校验逻辑集中在 api/index.go结构清晰二次开发门槛很低官方使用文档可参考 README.md内含完整的图标 ID 清单。常见问题速查表问题解决方法图标不显示检查i参数名称是否拼写正确、是否用了支持的简写想适配深浅主题使用默认的themeauto无需额外配置图片太宽太长调小perline值让每行图标数量更少别人看不懂冷门图标开启titlestrue显示技能名称想居中展示使用aligncenter或外层包裹p aligncenter以上就是 skill-icons 5 大核心参数的完整用法。从指定图标到主题切换从每行数量到名称显示再到对齐方式现在你已经全部掌握——快去给 README 加一面漂亮的技能墙吧【免费下载链接】skill-iconsFork of official skill-icons repository. Showcase your skills on your Github readme or resumé with ease ✨项目地址: https://gitcode.com/gh_mirrors/skil/skill-icons创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考