Awesome
leafer-ui
一款好用的 Canvas 引擎，革新的开发体验，可用于高效绘图 、UI 交互（小游戏、互动应用、组态）、图形编辑。
提供了丰富的 UI 绘图元素，和开箱即用的功能，如自动布局、图形编辑、SVG 导出等，方便与 PS、 Figma、Sketch 等产品进行对接。并为跨平台开发提供了统一的交互事件，如拖拽、旋转、缩放手势等。
如果你觉得不错，请帮我们点个 Star 🌟 ，让这个库被更多的人看见 - GitHub / Gitee ✨ ✨ ✨
快速入门
可通过 Cloud Studio 模版创建一个 LeaferJS 项目，用于运行、练习后续的示例代码。
跟随官网教程步骤（文档底部有下一步引导按钮）从浅到深的学习，动手调试每一段示例代码。
给你一条会飞的龙，看你能做出什么好玩的小游戏分享给我们 ◠‿◠
快速安装
🚀 想马上在产品中使用，请安装 leafer-ui，开始你的探索之旅。
场景包
高效绘图场景，推荐安装更轻量的 leafer-draw （49KB min+gzip）。
游戏开发场景，推荐安装更省心的 leafer-game，已集成了游戏相关插件。
图形编辑场景，推荐安装更省心的 leafer-editor，已集成了图形编辑器相关插件。
互动交流
有问题、建议可以 提交 issue，留下你的贡献足迹，了解 提问的智慧 。
欢迎加入 技术交流群 ，与小伙伴们建立联系，共同学习进步，偶尔会有特殊福利。
仓库组成
LeaferJS 主集成仓库，可直接运行代码。
leafer 核心仓库。
leafer-ui UI 仓库。
leafer-in 插件仓库。
leafer-x 社区插件提交仓库。
test 自动化测试仓库。
使命与愿景
LeaferJS 致力于实现一套简洁、开放、现代化的 UI 绘图语言标准，表现力丰富，便于 AI 理解，人类可视化使用，并为数字化产品开发提供跨平台、轻量化、高性能的运行时。
让不同的软件之间能够沟通、协作、共享绘图数据，让数字化产品开发可以更快、更简单。
通过不断革新的图形渲染技术、配套支持， 吸引更多的开发者加入使用，建立起一个开放的生态环境，沟通有无，互相从中受益，推动行业的快速发展，并诞生出更多有创意的技术和产品。
我们的目标不仅是让它成为前沿的 2D 和未来的 3D 引擎技术，还希望它能够为开发者带来极致的开发体验，助力开发者快速构建 AI 时代的网页、应用、设计、画布、游戏和动画等可视化生产力工具（如下一代 local-first 的 Figma、Miro、Notion、Unity、Adobe、Canva、Webflow 等）。
这是一段漫长而又充满乐趣的旅程，我们正在年复一年、坚定地向这个目标持续前进，可以通过 开发计划 了解更多信息。
卓越文化
我们追求慢慢打造出这样的团队与社区氛围:
真诚坚韧、追求卓越、热爱生活、与众不同、倾听、互帮互助、懂得取舍、不怕失败、结果导向
我们相信当一个人身心强健，对这个世界充满无限好奇的时候，会产生出源源不断的生命力和创造力，所以我们鼓励追求卓越与热爱生活，也许我们会因为健身、美食、旅行、摄影、音乐、写作、绘画、舞蹈、游戏等热爱而了解彼此，也许我们还会有自己的乐队、画展、读书会...
我们要一起去攀登一座座别人从未到达过的高峰，同时我们也了解自己的能力边界，将聪明才智都聚焦到我们最感兴趣，也对用户最有价值的那个点上，在那里做出前人未曾有过的东西。
我们知道成功并非一蹴而就，所以我们接纳路途中的失败、偶尔的躺平，只要拥有坚韧的气质和永不放弃的精神，从失败中吸取教训，不断成长，积累一个个小小的胜利，就一定会抵达目的地。
希望我们能一起创办出 一家像胖东来一样的新型互联网企业和社区， 如果你喜欢这样的文化，欢迎阅读 贡献指南，可以一起参与进来。
贡献指南
当你使用 LeaferJS 时, 你就已成为了 这个充满活力的大家庭 的一员，踏入这座建设中的“技术城堡”。只有通过每位成员的热情参与与贡献，这座城堡才能逐步走向完善。
有问题、建议可以 提交 issue 讨论，它更加开放与透明，能够帮助社区沉淀经验，避免重复劳动。
致谢贡献者
赞助商
<p><h3 align="center">金牌赞助商</h3></p> <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;"> <a target="_blank" href="https://github.com/dromara/yft-design"> <img width="180" title="yft-design" src="https://www.leaferjs.com/image/sponsor/gold/yft.jpg" loading="lazy" /> </a> <a target="_blank" href="https://www.finclip.com/landing/miniappgame?from=leafer"> <img width="180" title="FinClip" src="https://www.leaferjs.com/image/sponsor/gold/finclip.jpg" loading="lazy" /> </a> <a target="_blank" href="https://hiif.ong"> <img width="180" title="hiif" src="https://www.leaferjs.com/image/sponsor/gold/hiif.jpg" loading="lazy" /> </a> <a target="_blank" href="https://www.seafox.cc"> <img width="180" title="seafox" src="https://www.leaferjs.com/image/sponsor/gold/seafox.jpg" loading="lazy" /> </a> <a target="_blank" href="https://dooring.vip"> <img width="180" title="dooring" src="https://www.leaferjs.com/image/sponsor/gold/dooring.jpg" loading="lazy" /> </a> <a target="_blank" href="https://pro.kuaitu.cc"> <img width="180" title="快图设计" src="https://www.leaferjs.com/image/sponsor/gold/kuaitu.jpg" loading="lazy" /> </a> <a target="_blank" href="https://chensuiyi.me"> <img width="180" title="前端之虎陈随易" src="https://www.leaferjs.com/image/sponsor/gold/chensuiyi.jpg" loading="lazy" /> </a> <a target="_blank" href="https://boardos.online"> <img width="180" title="在线实时白板协作系统" src="https://www.leaferjs.com/image/sponsor/gold/boardos.svg" loading="lazy" /> </a> <a target="_blank" href="http://www.yunform.cn"> <img width="180" title="数据查询录入表单页面制作效率工具" src="https://www.leaferjs.com/image/sponsor/gold/yunform.svg" loading="lazy" /> </a> </p> <p><h3 align="center">银牌赞助</h3></p> <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 5px;"> <a target="_blank" href="https://github.com/daodaolee"> <img width="40" title="道里" src="https://www.leaferjs.com/image/sponsor/user/108.jpg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/4c42d1dc97f311ef908752540025c377"> <img width="40" title="dong" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/e46181dc5e1b11ef87ce52540025c377"> <img width="40" title="爱发电用户_PxsB" src="https://www.leaferjs.com/image/sponsor/user/blue.png" loading="lazy" /> </a> <a target="_blank" href="https://www.fastadmin.net"> <img width="40" title="F4nniu-FastAdmin开源框架" src="https://www.leaferjs.com/image/sponsor/user/85.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="风之影" src="https://www.leaferjs.com/image/sponsor/user/81.jpg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="😊" src="https://www.leaferjs.com/image/sponsor/user/79.jpg" loading="lazy" /> </a> <a target="_blank" href="https://pro.kuaitu.cc/"> <img width="40" title="秦少卫" src="https://www.leaferjs.com/image/sponsor/user/72.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/a/herobeast"> <img width="40" title="herobeast" src="https://www.leaferjs.com/image/sponsor/user/63.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/e16c1f960c1d11ef8b7552540025c377"> <img width="40" title="Evel" src="https://www.leaferjs.com/image/sponsor/user/62.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/f77b17e400bd11efa77c5254001e7c00"> <img width="40" title="robot" src="https://www.leaferjs.com/image/sponsor/user/61.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/db7681e4005111efb4d45254001e7c00"> <img width="40" title="icezeros" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/100c3db0005011ef828d52540025c377"> <img width="40" title="林伟强" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href="https://github.com/Misakey-Mikoto"> <img width="40" title="misakey" src="https://www.leaferjs.com/image/sponsor/user/orange.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/446c7466fbce11eebaea5254001e7c00"> <img width="40" title="junna" src="https://www.leaferjs.com/image/sponsor/user/57.jpeg" loading="lazy" /> </a> <a target="_blank" href="http://www.nickspace.cn"> <img width="40" title="NickSpace" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/a/ziiziz"> <img width="40" title="YGG" src="https://www.leaferjs.com/image/sponsor/user/55.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/49e029bafd2c11eea4bd5254001e7c00"> <img width="40" title="tony" src="https://www.leaferjs.com/image/sponsor/user/51.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/58b6df30fb0411eeb1e252540025c377"> <img width="40" title="lk" src="https://www.leaferjs.com/image/sponsor/user/48.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/ddafe100f58c11eea53652540025c377"> <img width="40" title="214L" src="https://www.leaferjs.com/image/sponsor/user/47.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/987502eaf87611eeb08052540025c377"> <img width="40" title="南" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title=".." src="https://www.leaferjs.com/image/sponsor/user/44.jpg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="__tynam" src="https://www.leaferjs.com/image/sponsor/user/43.jpg" loading="lazy" /> </a> <a target="_blank" href="https://github.com/zhixiaotong"> <img width="40" title="知晓同丶" src="https://www.leaferjs.com/image/sponsor/user/42.png" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="馒头" src="https://www.leaferjs.com/image/sponsor/user/41.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="烟雨江南" src="https://www.leaferjs.com/image/sponsor/user/37.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="sunboy" src="https://www.leaferjs.com/image/sponsor/user/36.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="张恒来啦" src="https://www.leaferjs.com/image/sponsor/user/35.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="呆若牦牛" src="https://www.leaferjs.com/image/sponsor/user/34.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="艳霞" src="https://www.leaferjs.com/image/sponsor/user/33.jpeg" loading="lazy" /> </a> <a target="_blank" href=""> <img width="40" title="robot" src="https://www.leaferjs.com/image/sponsor/user/29.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/1a0a7664f7aa11ee906d52540025c377"> <img width="40" title="刘杨" src="https://www.leaferjs.com/image/sponsor/user/26.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/7ca4df10f60d11eebbe652540025c377"> <img width="40" title="biudefar" src="https://www.leaferjs.com/image/sponsor/user/25.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/1a9fa4d20e3511eebd235254001e7c00"> <img width="40" title="skywalker512" src="https://www.leaferjs.com/image/sponsor/user/21.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/a/xiaou-utools"> <img width="40" title="xiaou" src="https://www.leaferjs.com/image/sponsor/user/19.jpg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/4752d472f6d311ee8c375254001e7c00"> <img width="40" title="黄鸭梨" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/1b50c4dcf64811ee8a6b52540025c377"> <img width="40" title="子洋" src="https://www.leaferjs.com/image/sponsor/user/17.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/901e5b3ef64411ee855f5254001e7c00"> <img width="40" title="一只胖憨憨" src="https://www.leaferjs.com/image/sponsor/user/16.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/b25e2fbef62911ee8a965254001e7c00"> <img width="40" title="channely" src="https://www.leaferjs.com/image/sponsor/user/15.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377"> <img width="40" title="ibryang" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377"> <img width="40" title="阎魔罪歌" src="https://www.leaferjs.com/image/sponsor/user/11.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/6332e502f5b511eebb6a52540025c377"> <img width="40" title="kooriookami" src="https://www.leaferjs.com/image/sponsor/user/10.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/8b178a02f5b011ec9b4b52540025c377"> <img width="40" title="毛豆花生" src="https://www.leaferjs.com/image/sponsor/user/8.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/a/programschool"> <img width="40" title="编程学院" src="https://www.leaferjs.com/image/sponsor/user/7.jpg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/8230187ef5a811eeba2d5254001e7c00"> <img width="40" title="Jikun" src="https://www.leaferjs.com/image/sponsor/user/5.jpeg" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/606e6332f55111eeb78352540025c377"> <img width="40" title="黄某人" src="https://www.leaferjs.com/image/sponsor/user/purple.png" loading="lazy" /> </a> <a target="_blank" href="https://afdian.com/u/681f0bd0eff311ee975a52540025c377"> <img width="40" title="爱发电用户_xugk" src="https://www.leaferjs.com/image/sponsor/user/yellow.png" loading="lazy" /> </a> </p> <p><h3 align="center">铜牌赞助</h3></p> <p style="display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;"> 李维亮 朝夕 SaltedFish zhk 格子 等等 goosen 建伟F4nniu 梁福斌 江万江 杨超 ToB Dev 前端之虎陈随易 A☀️云☀️A ʚ LMT ɞ 爱发电用户_c9c82 轻简历 爱发电用户_0fac0 wangyesheji.cn 风间 爱发电用户_Tqsm 爱发电用户_6KpE dongdong zwm 爱发电用户_3725c Noth1ng 纳西妲の√ 爱发电用户_Ahb9 爱发电用户_7617d 冷漠 爱发电用户_9RXB 今日值得读 爱发电用户_49sT 爱发电用户_NFCS 爱发电用户_43ad8 爱发电用户_30455 xiaozhang 砖吐筷筷 爱发电用户_b47b3 longbow1998 爱发电用户_5d755 爱发电用户_b76b8 爱发电用户_e70c2 爱发电用户_039dc 花祁 爱发电用户_99f39 坤坤 爱发电用户_X6hp 爱发电用户_s5u9 曹吉美爸爸 啸沧海 Ronny Biu 王志强 PD.新城คิดถึง 糖颂缘冥倾 ALBERT. 爱发电用户_UXEV SaltedFish 爱发电用户_76f9d Leafer 爱发电用户_Pbm7 </p>License
MIT 开源许可协议，可以免费使用，且能用于商业场景。
Copyright © 2023-present Chao (Leafer) Wan