Skills Icons: 在 Markdown 中添加技术栈图标很简单


想在自己的 GitHub 或Markdown 简历中这样展示自己的技术栈吗?我猜你是想的,因为我也想~。如果用文字写的话感觉不够形象,如果一个一个去找对应技术的图标,那工作量简直太大了。那这是怎么实现的呢?听我慢慢道来。

Skills Icons


今天和大家介绍的工具是 Skills Icons,它能够非常简单的在 Markdown 中插入技术栈的图标。它的使用方式有多简单呢?总共分三步:

1.Markdown 插入链接

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


此时已经展示了选择的四个图表。

2.查找你需要展示的技术栈code

Skills Icons 目前支持 160 个技术图标,包含大部分的常见技术栈。

技术栈对应的 code 可以在 Skills Icons 仓库中查询。


接下来把code放到链接的i参数上,并用英文逗号分开。例如:

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

3.调整样式

是的,Skills Icons 是可以调整样式的。Skills Icons 支持两种主体样式:light 和 dark。可以在链接后拼接 theme 参数。&theme=light

如果你擅长的技术栈比较多,Skills Icons 还支持换行展示。可以通过在链接后拼接 perline 参数指定每行展示图标的个数。 &perline=3

分享一个我生成的技术栈展示效果:

4.总结

Skills Icons 是在 Markdown 中添加技术栈图标的最简便方式。操作简单,还支持样式的调整,绝对能满足你的需求。大家快去试试看吧。


欢迎点赞、评论、转发~

原文链接:,转发请注明来源!