vscode的字体图标库-icomoon

icomoon官网下载地址:SVG Icon Libraries and Custom Icon Font Organizer ❍ IcoMoon Easily mange your icons and integrate them in your projects. Browse free icons or import your own SVG icons to export as icon font, SVG, PNG, sprite and more.https://icomoon.io/https://icomoon.io/

打开网站:

显示自己选取的图标数:

点击下载图标:

下载完解压后:

先把fonts文件复制放在自己编写的HTML文件下:

注意:fonts文件是复制而不是拖进去,拖进去会造成,当你打开demo.html显示不出原本图标的样子;

如果目录没有放对网页会出现:

然后打开style.css,复制如下代码放到style标签里面用来字体声明:

再打开demo.html选取自己要用的图标:

如下所示:

还有定义span样式:

运行结果如下:

最后,后期需要添加图表样式,可以在官网点击如下,上传selection.json添加图标。

弹出点yes,然后选要添加的图标,

从63多添加到74,之后重新下载。

相关推荐
克里斯蒂亚诺更新13 小时前
myeclipse的pojie
java·ide·myeclipse
羌俊恩17 小时前
Vim modeline 命令执行漏洞(CVE-2026-34714)修复指导
linux·编辑器·vim·漏洞·cve-2026-34714
Project_Observer20 小时前
为您的项目选择最合适的Zoho Projects自动化巧能
大数据·运维·人工智能·深度学习·机器学习·自动化·编辑器
时光之源20 小时前
Labelme安装及使用说明教程
vscode·数据集·cursor·labelme·数据标注
好运的阿财20 小时前
“锟斤拷”问题——程序中用powershell执行命令出现中文乱码的解决办法
linux·前端·人工智能·机器学习·架构·编辑器·vim
砖头拍死你20 小时前
Powershell使用vim修改文件保存后文件名自动全变小写
linux·编辑器·vim
意疏1 天前
【C语言】解决VScode中文乱码问题
c语言·开发语言·vscode
Dshuishui1 天前
VSCode 环境下编译运行 C++ 项目
c++·ide·vscode
swear011 天前
【VSCODE 插件 rust-analyzer 使用】打开文件夹
ide·vscode·rust
ShawnLiaoking1 天前
Github 克隆 PyCharm,vscode
ide·pycharm·github