技术藏集

开发相关

• Can I use 兼容性查询
• carbon 代码图片生成
• npm trends 比较 npm package 的下载情况
• Bundlephobia 分析 npm package 的依赖、bundle 后的大小、下载速度预估
• Package Phobia 查询 npm package 的安装体积（磁盘大小）

沙箱

• CodeSandbox
• Codepen

正则

• 正则可视化工具
  • cyrilex
  • pyrexp
  • regulex
  • regexper
  • 正则可视化
• regex101 在线正则测试工具
• regexgen 生成与一组字符串匹配的正则表达式
• any-rule 正则大全

代码编译

• ast 生成器
• rollup

JS 相关

• Babel
• TypeScript

Vue

• Vue Template Explorer
• Vue 3 Template Explorer
• Vue SFC Playground

CSS 预处理器

• Sass Playground
• Less-To-CSS Playground
• Stylus Playground
  • 英文官网
  • 中文站点

代码生成

• webcode.tools Web 代码生成工具 (CSS、HTML、meta 信息、JSON 等)
• nginx 配置可视化生成 (github)

CSS 相关

• CSS Grid Generator grid 布局
• FANCY-BORDER-RADIUS border-radius 圆角
• CSS Shadows Generator box-shadow 阴影
• Cubic-Bezier 贝塞尔曲线
• Easing Gradients 渐变
• Clippy — CSS clip-path maker clip-path
• Neumorphism/Soft UI generator border-radius / background / box-shadow

SVG 相关

• Get Waves SVG 波浪生成器

CDN

• jsDelivr
• esm.sh

图片处理

图片底色去除

• remove.bg
• BgRemover

图片压缩

• TinyPNG
• docsmall
• squoosh Google 开源的图片压缩工具

图片生成

• Shields.io 绘制小徽章

• 生成 Github 仓库 Star 增长图

  • Star Charts 数据更详细
  • Star history 手绘风格

• Notion 风格头像制作

作图工具

• ProcessOn 免费在线流程图思维导图
• Draw.io 流程图
• Excalidraw 手绘风格流程图

文件处理

• 在线格式转换
  • CloudConvert 在线文件转换器，支持 200+ 种格式、支持自定义设置、图片可在线预览（英文界面）
  • Convertio 在线转换文件的简单工具，支持 300+ 种格式、支持自定义设置（最大 100M）

休闲娱乐

yikm 小霸王在线游戏机