WebToolkit(web工具箱,一些前端需要的小工具)
2021-03-30 本文已影响0人
YouthAndTheSea
写在前面
WebToolkit是自己在闲暇之余造的一个小轮子(主要是自己水平有限🤪勉强能用),在这里不得不安利一下Electron这个库。就连大名鼎鼎的vscode也是用它开发出来的,前端的同僚们都知道vscode使用起来丝滑流畅。由此可见其强大之处,另外社区也比较活跃,主要还是它让前端也能开发桌面端程序😎
引用官方的简介使用 JavaScript,HTML 和 CSS 构建跨平台的桌面应用程序,也就是说不管你用什么前端框架JQuery
,Vue
,Angular
,React
都可结合Electron写出自己的桌面程序想想是不是觉得有点小激动😂
📺预览
![](https://img.haomeiwen.com/i13266141/6327a706fc89e550.jpg)
🏷️安装
- 下载地址
- WebToolkit-Win32.zip 和 WebToolkit-Win64.zip 绿色免安装版
- WebToolkit.Setup.zip 安装包
✨使用
1.RGB和16进制互换
- 点击箭头可以实现RGB颜色和16进制互相转换
- RGB:RGB颜色
- HEX:16进制颜色
- 右侧方框颜色预览
![](https://img.haomeiwen.com/i13266141/0e5c4d175c4be889.jpg)
2.SVG文件压缩,可以到iconfont下载图标svg
- 点击选择SVG文件选择好SVG文件,自动压缩
- 压缩完成后可以预览SVG,以及显示压缩比例
- 下载、复制以及删除当前SVG
![](https://img.haomeiwen.com/i13266141/9eef12bffada05a2.jpg)
3.屏幕取色器
- 点击吸管即可开始取色,此时鼠标会变成吸管
- 移动鼠标到想要取色的地方点击即可完成取色
- X,Y:鼠标坐标
- HEX:16进制颜色
- RGB:RGB颜色
- 右侧方框颜色预览
![](https://img.haomeiwen.com/i13266141/5dfd90c9978c917e.jpg)
4.JSON格式化
- 输入或者粘贴JSON代码到文本域
- 点击格式化按钮即可格式化JSON
- 点击压缩即可压缩JSON
- 点击复制即可复制JSON代码到剪贴板
![](https://img.haomeiwen.com/i13266141/5e8be26bff7e6226.jpg)
5.支持换肤有三种皮肤可选择
![](https://img.haomeiwen.com/i13266141/6327a706fc89e550.jpg)
![](https://img.haomeiwen.com/i13266141/59a59b6637c27301.jpg)
![](https://img.haomeiwen.com/i13266141/e3dfbdc04b8d0def.jpg)
🤝问题
- 提交Issues或者发送邮件到wind19952@gmail.com
如果觉得还不错的话可以帮我点个星星🖖