2026-10-16 00:00:00
10 月 15 日的 Config India 上，Figma 集中发布了一批连接设计、代码与内容的功能。Code layers 开始进入公开测试：可以把设计稿转换成可交互的代码原型，也能从 GitHub、本地文件夹或现有网页导入，在 Figma 画布上和团队一起比较、修改方案。
同场亮相的 Figma Specs 为 Markdown 文档、设计画面和技术细节提供共享空间，方便团队与 Agent 一起整理需求；Figma Make 则接入 Payload，可为应用生成带 CMS、数据库、认证和管理后台的后端。设计系统方面，规范文件进入公开测试，GitHub 或 npm 代码源进入封闭测试；Figma MCP 也增加了对代码图层、Specs 等工作流的支持。Code layers 和 Specs 正逐步开放测试，集中式设计系统目前仅提供预览。
发布总览：https://www.figma.com/blog/build-by-design/
10 月 13 日起，Figma Make 开始逐步加入 Gemini 4 Argon。创建或修改原型时，可以在聊天框的模型选择器中切换到它；Figma 表示这一模型面向所有计划开放。
这次更新增加了 Make 的模型选择，但仍处于逐步推出阶段；如果账户里暂时看不到，可以稍后再检查模型菜单。对经常用 Make 生成界面与交互原型的人来说，多一个模型选项也方便比较不同模型的生成结果和修改方式。
官方发布说明：https://www.figma.com/release-notes/
最近 Figma Make 调整了「Copy design（复制设计）」的入口。它不再直接显示在预览顶部：先点击预览右上角的 Edit，再到画面底部的浮动工具栏找到复制设计按钮。最近找不到这个功能的小伙伴，可以按这个路径试试。 还有就是右上角的「播放」按钮，新页面打开后右上角也有复制设计按钮
复制时除了当前页面或所选元素，还能选择 Record flow（录制流程）：在可交互原型中依次走过需要的页面和状态，结束录制后将这些画面一起复制到 Figma Design，继续作为可编辑图层调整。复制得到的是画面快照，不会保留 Make 原型中的交互，设计稿里的修改也不会自动回写到 Make。官方帮助中心说明，复制设计图层面向付费计划开放。
Figma Make 官网：https://www.figma.com/make/
新入口说明：https://forum.figma.com/report-a-problem-6/copy-design-is-missing-in-one-figma-make-file-58690
复制后的图层与限制：https://help.figma.com/hc/en-us/articles/35060759685015-Copy-a-Figma-Make-preview-as-design-layers
「PPT 播放 Lottie 动画」给 PowerPoint 和 WPS 分别提供插件，让幻灯片在放映时直接播放 Lottie JSON 动画。可以把 .json 文件拖进幻灯片，也能填写动画网址或粘贴 JSON；播放速度、循环和背景色可以继续调整。相比把动效做成 GIF，Lottie 能保持清晰的矢量边缘，适合在演示中展示界面动效或说明流程。WPS 版支持透明背景，PowerPoint 的部分版本则可能显示白底。
动画数据会保存在演示文件里，但放映时仍需联网加载播放器页面。PowerPoint 版在编辑视图不播放，接收文件的人也需要安装插件；WPS 版可在编辑视图预览，接收者无需另装插件。导出 PDF 或视频时动画不会保留。插件支持 Windows 与 macOS，适用于 PowerPoint 2016 及以上或 WPS 2019 及以上；免费使用，下载安装包需要登录网站账号。
官网与下载：https://www.sjfls6.com/products/ppt-lottie/
OpenPencil 是一款采用 MIT 许可的开源界面设计编辑器，可以直接打开和保存 .fig 文件，将页面、组件、实例、变量和自动布局作为可编辑图层处理。它提供布局、文字、填充和效果等设计能力，也能把 SVG、HTML 和 CSS 导入画布，适合希望在本地继续编辑已有设计的团队或个人。
除了手动设计，也可以接入自己的模型 API Key，用自然语言让 AI 创建和修改图层；通过 MCP，还能让外部 Agent 操作同一份文档。工具提供浏览器入口、桌面应用和 CLI，适合探索从界面设计到 AI 自动化的工作流程。
亲测了一下基础设计功能还行，但是细节偶有bug，添加 AI 操作界面测试失败了，有兴趣的可以直接试试
ArtCraft 将 13 款创作应用放在同一套产品中，涵盖图像处理、矢量绘图、视频剪辑、动效制作、排版、界面设计、文档和音频等方向。团队列出的应用包括 PhotoCraft、VectorCraft、FilmCraft、EffectCraft、DesignCraft 与 FigCraft，可以按自己的工作内容选择安装。
官网介绍这些应用为原生桌面软件，并提供 ArtCraft Launcher 和各应用的独立安装方式；部分工具也可在浏览器中体验。对需要组合使用多种创作工具的人来说，可以从一个目录了解这套软件各自负责的环节。
应用目录：https://getartcraft.com/apps
Shotbase 把截图、录屏和网页截图放进同一个 Mac 工作流里：可以捕捉画面、添加背景和标注、编辑录屏，再把成品整理和分享出去。录屏支持自动放大关键区域，也能加入文字、阴影和其他效果，适合制作产品演示、设计反馈和操作说明。
它还提供本地 AI 帮截图生成名称、标签和摘要，方便之后搜索；官网说明图像分析在本机完成，不会把截图发给远程模型。此功能需要 Apple 芯片的 Mac。
Tangerine 是一款面向 Mac 的本地文件转换工具。把文件拖到应用中后，按住 Shift 即可转换格式；需要压缩、裁切、修剪、拆分或合并时，再按住 Option 调出高级操作。官网列出的格式覆盖图像、视频、音频、文档和压缩包。
文件处理在本机完成，不需要先上传到在线转换网站。官网目前列出 190 种转换选项和 25 种高级文件操作，支持 Apple 芯片并要求 macOS 13 或更新版本。
官网：https://tangerineformac.com/
Paper Mono 是 Paper 设计团队制作的免费开源等宽字体。官网没有停留在字体下载页，而是把字形和排版做成了可交互的展示：可以在页面里边看边试，直观感受字体的形态与气质。页面本身的视觉节奏也很有趣，值得作为字体展示网站的设计案例逛一逛。
字体包含 8 个字重、800 个字形，并覆盖 100 多种语言；还提供编码连字、双宽字符、窄空格、小箭头、单层 a 和带斜线的 0 等样式功能，适合代码、标题、界面文字和数字信息展示。授权为 SIL Open Font License 1.1；使用、修改或随软件再分发时，需要遵守对应条款。
字体预览与下载：https://paper.design/mono
项目与授权：GitHub
CSS Composite Font 是一个免费开源的网页工具，把 InDesign、Illustrator 中的「复合字体」思路带到网页排版。汉字、假名、标点、西文和数字可以分别指定字体、大小与基线；调整时可用中文、日文等示例或自己的文字实时校样，也能检查字体缺字情况。
工具支持 Google Fonts、本机字体和字体文件，并提供多字重、竖排与预设等选项。完成后可导出直接用于网页的 CSS，核心做法是用 @font-face 的 unicode-range 分配字符、用 size-adjust 调整大小。需要留意的是，CSS 没有直接调整 @font-face 基线的描述符：如果设置了基线偏移，导出结果还会附一小段 JavaScript；基线保持为零时则只需要 CSS。
在线体验：https://charlie5188.github.io/css-composite-font/
源码与许可：GitHub
Uwarp 把 500 多款可在浏览器中使用的免费工具整理成一个入口，覆盖图像与音频转换、SVG 生成、配色、图标、字体和样机等方向。首页按用途分类，也可以直接浏览全部工具，适合设计时临时查找一个轻量的小功能。
站点同时收录创作、灵感和学习资源，不只限于文件处理。需要快速转换素材格式、试一组颜色或寻找图形工具时，可以先从对应类别进入，再比较同类工具的功能与使用方式。
UCharts 是一款 Figma 图表插件，可以把数据做成折线图、柱状图、面积图、饼图、散点图和雷达图等可视化内容。选择图表类型后，可以导入 Excel 或 CSV 数据，调整配色、字体与布局，再把图表放进设计稿，适合制作仪表盘、报告或演示页面。
它也提供在线图表编辑器，支持从模板开始制作，并导出图片、SVG、PDF 或 HTML 等格式。需要反复修改真实数据的设计师，可以先用插件把图表放到 Figma 中，再根据页面风格调整视觉细节。
在线图表工具：https://o.uwarp.design/uchart
插件开发者为周刊读者提供了 7 个 UCharts 密钥，先到先得：
一个月期（5 个）
AEE20D99-8AA7-4BF0-8A49-546A23254209731A6785-AC0D-449F-B45E-B751ECB78E5E832D67BB-0501-4E66-B01F-5981321DD69A28D32691-D4DA-493B-83C4-4E1C96A89FB4BA7CE1CA-C47C-4E74-BC0F-C57B2D77526D一年期（2 个）
8824EA84-8FE0-4F81-AAB5-4BE9B1E376CBA6FF756D-21A1-4E42-8B3E-B81EDA16D6ABApple 已发布 iOS 和 iPadOS 27 官方 UI Kit，提供 Figma 与 Sketch 版本；新版更新了 Liquid Glass，并扩充组件和状态、调整与代码更一致的命名，也改进了尺寸调整。官方资源页还附有 iOS、iPadOS 和 watchOS 27 的 App Icon Template Figma 文件。
可以从下面的 Figma Community 文件打开资源或复制到自己的草稿中；使用 Apple UI Kit 前需要接受相应的许可条款。界面行为和组件规范可同时参考 Apple Human Interface Guidelines。
QingIcon 2.0 收录了 3,900 多个图标，并提供 13 万多个中英文关键词用于检索。除了常用图形，也整理了 AI、云计算等成体系的图标家族；遇到关键词匹配不到时，还有抽象图标可以兜底。图标可以一键切换为草图风格，也提供 Optical 光学修正和 Padlock 跨工具占位等功能。
除了官网搜索，QingIcon 也提供 Figma 插件、React 和 Vue 的 NPM 包，以及 MCP Server。设计时可以直接把图标放进 Figma，写代码时通过组件包接入，使用 Agent 时也能用自然语言检索合适的图标。
Tabbied 将生成式图案和网站模板放在同一个浏览器工具里。选择图案后，可以实时调整颜色、频率和密度，预览结果会随设置即时变化；确定后可以导出 PNG 或 SVG，作为网页背景、海报或其他视觉设计的起点。
除了图案生成器，网站还收录以同一图案引擎制作的网页模板。它适合先从一组图形和配色出发，再把风格延伸到完整页面的场景。
Book of Shapes 收集了一组可定制的生成式 SVG 图案，包含网格、流线、放射、噪点、等距和有机形态等方向。每个图案都以规则和变化构成，可以用来寻找背景、包装、海报或界面装饰的视觉起点。
浏览时可以按图案类型筛选，也可以查看近期和热门作品。因为素材以 SVG 形式呈现，放大使用时仍能保持矢量边缘，适合继续在设计软件或代码中调整。
Detail 收集那些能让产品体验更周到的小设计决定，并按设计、交互、动效、文案、无障碍和 Easter egg 等主题整理。案例包括适应翻译的文字换行、输入框占位提示、按住快捷键显示提示，以及圆角形态变化等具体做法。
与只看完整页面的灵感库相比，这里更适合研究一个局部决策如何回应用户行为。设计表单、快捷操作、动效反馈或空状态时，可以从案例中找到可借鉴的细节，再结合自己的产品语境重新处理。
DesignEng 把设计工程相关的组件库、UI 资源、AI 工具、灵感站、学习资料、字体、技能和创作者放在一个可浏览的目录中。条目附有简短介绍和分类，方便从一个资源继续发现同类工具或替代方案。
它适合需要同时考虑界面设计和前端实现的人：可以按组件、设计系统或灵感等方向缩小范围，再比较不同资源的适用场景。网站也提供免费、部分免费、付费、开源和试用等筛选项。
官网：https://www.designeng.tools/
A1 Gallery 精选仍在线的网站案例，并提供页面、区块、OG 图片、字体和个人主页等浏览入口。首页可以按网站类型与行业分类查找；进入案例后，也能从页面结构、视觉风格和使用技术等角度继续探索。
如果正在为官网、作品集或营销页面寻找参考，可以把它当作一个持续更新的网页案例索引。收藏功能还支持把喜欢的页面和区块整理成自己的 board，方便后续对照和复盘。
Arc 提供带动效的 React 组件和页面区块，官网列出 150 个组件与 88 个 blocks。示例可以直接操作预览，例如拖动图表、打开选择菜单或切换日期；查看组件时也可以在预览和代码之间切换。
组件可以通过 shadcn CLI 安装，也能复制源码到自己的项目继续改造。对于想快速搭建带有细节动效的仪表盘、表单和产品流程的开发者，可以先用在线示例判断交互是否符合需要，再决定是否引入。
MetalUI 将软塑料、烟熏玻璃和金属质感带进 React 与 SwiftUI 组件中，并通过按压、悬停和状态变化表现出更接近实体控件的反馈。它既提供按钮、菜单、表单和滑块等组件，也整理了色彩、字体、间距、材质、动效等设计基础。
这个项目适合探索带有实体感的界面语言，或为应用补充一组统一的材质和交互参考。组件文档、设计基础和示例都可以直接浏览，便于先评估风格与项目是否匹配。
Shaders 开源提供 200 多个 WebGPU 效果组件，可以组合渐变、噪点、玻璃、金属、光效和扭曲等效果，并用于 React、Vue、Svelte、Solid 与原生 JavaScript 项目。每个组件都有实时预览和参数说明，方便先试效果，再放进网站、模板或产品里。
除了直接写代码，也可以在 Shaders 在线编辑器 的画布上组合组件、调整参数，并免费导出对应框架的代码。仓库和 npm 包采用 MIT 许可；网站上的编辑器、预设等平台内容另有各自条款，使用时可以分别查看。
仓库：https://github.com/shader-effects-inc/shaders
ISO-GLOW 是一个 Claude Skill，可以根据物体、设备或建筑的描述，生成一个包含等轴测 SVG 图形的独立 HTML 文件。图中的部件还能响应点击并产生反馈，适合制作可探索的小型物件示意或空间场景。
它把等轴测投影、图层绘制和点击交互封装进 Skill，生成结果可以直接作为单文件页面查看。技能源码以 MIT 许可发布；官网和仓库示例都可以先体验，再决定是否安装使用。
技能源码：iso-figure
Reelfolio 可以把设计截图、样机和屏幕录制整理成作品展示视频。选择动态模板后，将素材上传并调整画面比例、背景、动效和音频，再导出适合放进作品集、提案或社交媒体的 showreel。
模板卡片悬停时会直接播放对应的成片效果，方便比较不同的转场和视觉节奏；整个流程围绕选模板、上传素材、微调和导出展开，不必从空白时间轴开始剪辑。
One Design 把图片压缩、改尺寸、抠图、格式转换、批量裁切、水印、PDF 处理、二维码和元数据清理等小工具集中在一个可搜索的浏览器工作台里，适合处理日常设计交付中的零散任务。
它的一点特色是文件直接在浏览器和本机设备上处理，不会上传到服务端；Cutout 首次使用时会下载识别模型，但本地图片不会随模型请求发送。使用工具需要免费账户，另有部分 Pro 功能。
Liquid Glass 为 React、Web 和 Electron 提供玻璃表面与控件组件，可以选择透明的 Clear 或磨砂的 Regular 材质，并适配浅色和深色外观。玻璃层后的内容仍保持动态可见，按钮支持按压和拖动反馈，菜单也能从触发控件展开。
示例页包含 Surface、Buttons、Toolbar、Tab Bar、Menu、Slider、Switch 和 Progressive Blur 等组件，每个示例都能在预览与接入代码之间切换。项目提供 NPM 包，源码采用 MIT 许可，适合想在界面中尝试玻璃材质与细腻交互的 React 开发者。
组件示例：https://liquid-glass.glassapp.dev/#examples
源码：GitHub
ascii.rest 收录了 196 组动态 ASCII 画面，从全彩场景、加载动画、图表和文字，到语言与系统标志、3D 形状、物理模拟和生物主题都能找到。每组都是轻量的 TypeScript 模块，无额外依赖，可用于 React、Next.js、Astro 或普通 HTML 页面。
在 HTML 页面里引入它提供的脚本并使用 <ascii-art> 标签即可嵌入，不需要安装依赖或构建步骤；动画进入可视区域后播放，也会尊重减少动态效果的系统偏好。项目免费并采用 MIT 许可。
23rd 是面向 shadcn/ui 项目的组件注册库，提供 Shader Gradient、ASCII Fluid、Live Orb、Typewriter、Stretchy Footer 和 Dithered 404 等背景、动效与界面组件。组件可以通过 shadcn CLI 单独添加到项目里，安装后源码归入自己的代码库，方便继续调整。
文档同时提供 React 和 Svelte 5 的安装命令与使用示例；可以按需挑选渐变、火焰、字符动画、页脚或错误页等效果，不必把整套库都引入。
源码：GitHub
Animos 提供一组循环动效模板，可以把图片或视频放入浏览器编辑器，调整设置后导出展示视频。模板涵盖多种构图与运动方式，适合快速为界面、海报或作品集截图增加动态呈现。
整个流程在网页中完成，不需要安装剪辑软件或从空白时间轴开始制作；完成后可导出 MP4 或 WebM，并选择常见画幅比例与分辨率。
Last Seen 把不同餐饮品牌做成一组可浏览的 3D 小景。页面先展示品牌卡片，点击后进入对应场景；用户可以拖动模型旋转，同时浏览品牌名称、创立年份和简短介绍。
它把品牌信息与可操作的空间模型放在同一页面里，适合观察 3D 场景如何成为网页内容的一部分，以及卡片选择、场景切换和拖动浏览如何组成轻量的交互体验。
体验页面：https://last-seen-diorama.vercel.app/
Atlas 面向设计灵感与视觉参考整理，可收集图片、视频和网页链接，再按项目或主题归入不同集合。浏览时可以切换网格、画布和无限画布等视图，既能快速扫看素材，也能把参考内容铺开比较。
应用以本地资料库为中心，也提供浏览器扩展、菜单栏收集入口和文件夹连接等方式；已有 Eagle 资料库也可以导入。适合希望把散落在网页、文件夹和截图中的参考集中管理的 Mac 用户。
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（moonvy.com）
2026-10-07 00:00:00
Figma Agent 结束测试并正式上线，AI 现在可以通过跨文件搜索理解团队已有的设计资产和工作内容，也可以读取以 Markdown 编写的设计库规范，让生成结果更贴近团队的组件、变量和使用约定。
与此同时，Figma 将生成式插件正式开放，设计师和开发者可以把 AI 能力扩展到更具体的工作流程中。不过，随着这些功能转为正式服务，Figma Agent 也开始消耗 AI 积分。对于正在尝试用 AI 参与设计生产的团队来说，这次更新意味着“让 AI 先读懂现有设计系统”正在成为更实际的工作方式。
Figma Motion 在开放测试期间继续扩展动效工作流：现在可以把常用的缓动、时长和其他变量属性保存为自定义动画样式，在不同设计和文件之间重复使用，也可以将多个样式组合成更复杂的动画模式并发布到团队库中。Figma Agent 和 Coding Agent 也可以通过 MCP 或 Skills 自动应用这些动画样式。
Motion 还把音频带进时间轴，支持将音频拖到动效片段中，进行裁切、分割和重新定位，并随动画一起导出 MP4 或 WebM。文字动画可以细化到单个字符、单词或行，同时保留文字图层的可编辑性；完成后还可以导出 Lottie 或 dotLottie 文件，把动效带到 Figma 之外。目前 Figma Motion 仍处于开放测试阶段。
功能说明：https://help.figma.com/hc/en-us/articles/41274629073303-Explore-Figma-Motion
Figma 移动端新增一组协作和浏览体验改进：可以通过页面下拉菜单快速访问和切换页面，用 Frame 预览滑块在不同画板之间移动，并把当前正在查看的页面或画板直接生成分享链接。现在也可以将单个画板或图片导出到手机，导出时选择格式和尺寸。
此外，应用会记住上次离开的位置，重新打开后可以直接回到之前查看的页面或画板，不需要再次导航。对于需要在手机上快速检查设计、分享局部画面或和团队同步进度的场景，这些改动能减少来回寻找内容的步骤。
发布说明：https://www.figma.com/release-notes/?title=smoother-design-collaboration
Sketch 在 Florence（2026.3）更新中继续强化了 Stacks。现在可以为 Stack 设置最小和最大尺寸、相对尺寸、负间距以及 z-index 排序，让自动布局在更复杂的界面结构里也能保持可控。对于需要做响应式卡片、叠放元素或特殊间距的设计，这些选项能减少为了“摆到正确位置”而增加的额外容器。
这次更新还加入了更多效果支持：群组可以直接使用模糊，画板可以设置多个阴影，玻璃效果和渐变效果也可以同时使用。Sketch 表示，这些能力还伴随了一批性能改进和错误修复。版本名 Florence 来自佛罗伦萨，Sketch 也为这次主要版本更新准备了对应的视觉主题。
更新说明：https://www.sketch.com/updates/
Sketch 官方动态：https://x.com/sketch/status/2092595467750174912
Sketch 最近展示了 Oklab 和 Oklch 渐变。与传统 RGB 插值相比，这两种颜色空间更接近人眼对明度和色彩差异的感受，尤其适合处理蓝色到黄色这类容易在中间出现发灰、发脏过渡的渐变。
Oklab 适合从明度、绿红轴和蓝黄轴的角度理解颜色；Oklch 则进一步把颜色表达成明度、色度和色相，更适合直接调整“更亮一点”“更鲜艳一点”或“沿着色相旋转”的视觉参数。实际输出仍然会受到显示器色域和颜色管理影响，但在设计阶段使用更合理的插值方式，可以让渐变的过渡更稳定，也更容易建立一套可复用的颜色规则。
Sketch 官方动态：https://x.com/sketch/status/2098688586736386553
在月维设计交付中已经支持 OKlch 渐变类型
HiPixel 是一款免费、开源的 macOS 原生 AI 图片放大工具，可以把模糊或低分辨率图片提升到更清晰的高清质量。它提供 Standard、Lite、High Fidelity 和 Digital Art 四种 AI 模型，也支持加载本地 ncnn 格式的自定义模型，适合处理照片、插画和数字艺术等不同类型的图片。
除了拖放批量处理，HiPixel 还支持文件夹监控、GPU 加速、1–5 倍对比查看、PNG/JPG/WebP 等多种输出格式，以及通过 URL Scheme 和 Apple Shortcuts 接入自动化流程。应用使用 SwiftUI 构建，支持 macOS 13 及以上版本，并以 AGPL-3.0 开源。
GitHub：https://github.com/okooo5km/HiPixel
框（Kuang）是一款在浏览器中使用的截图美化工具，提供背景、布局和标注调整，让普通截图更适合分享、展示和写进作品集。它内置绿色、黄色、日落、极光等背景效果，也支持柔光渐变、颗粒质感、留白、圆角和投影等处理，让画面更自然地融入背景。
工具支持高亮、放大镜和箭头标注，方便强调界面细节；图片在浏览器中处理，无需注册，并支持 1×、2×、3× PNG 导出和无水印下载。适合快速制作产品截图、设计案例、教程配图或社交媒体分享图。
官网：https://moonvy.com/apps/kuang/
浮影-Floating Shadows 是一个面向 Figma 的多层柔和投影生成器，用手工调校预设或三次贝塞尔曲线堆叠，为卡片、弹窗和悬浮表面生成自然、有空气感的阴影。
Figma 插件：https://www.figma.com/community/plugin/1682262103424224680/floating-shadows
ArtCraft 是一款面向艺术家的开源 AI 图像与视频创作工具，强调对生成过程的控制，而不是只追求一键生成。它支持在浏览器中使用，也提供 macOS 和 Windows 桌面应用，适合需要反复调整角色、场景和镜头关系的创作流程。
ArtCraft 提供角色姿态、场景和摄像机调度等更细致的控制方式，可以先确定画面构图和动作，再生成图像或视频；项目代码公开在 GitHub，也不要求订阅。对于想把 AI 生成融入概念设计、分镜、视觉开发或短视频制作，同时又希望保留更多创作自主权的人来说，值得关注。
GitHub：https://github.com/storytold/artcraft
这是一个面向花瓣网的 Tampermonkey 用户脚本，主要解决图片保存和页面右键受限的问题：可以一键下载当前图片的最高清原图，给可能用于商业用途的图片添加红框提示，并恢复浏览器原生右键菜单，方便使用“图片另存为”或其他浏览器扩展。
它适合经常在花瓣网收集参考图、整理素材的设计师使用。不过，脚本提供的是技术上的下载和提示能力，图片的版权、授权范围与实际商用许可仍需要单独确认。
脚本地址：Greasy Fork
QuickPick 是一个面向创作者的工作空间，用来集中保存设计工具、灵感链接、图片素材、文件和项目笔记。它把内容分成 Tools、Boards 和 Notes：工具可以快速收藏和发现，Boards 支持批量上传、拖放和批量下载，Notes 则可以记录设计决策、清单与参考链接，并支持文字高亮和基础排版。
它适合用来整理那些散落在浏览器书签、聊天记录、网盘和临时文档里的设计资料。比如可以为一个项目建立素材 Board，把灵感截图、参考网站、交付文件和色彩说明放在一起；也可以把常用的 Figma、Framer、Webflow、LottieFiles 等工具集中管理。免费工作区需要登录，具体容量和功能以官网当前方案为准。
官网：https://www.quickpick.space/
Moonvy 周刊资源库把历期《设计素材周刊》中的独立条目整理成可搜索的资源卡片，可以按类型、主题、产品、交付方式和技术栈筛选。每张卡片都保留原条目的简介、标签和配图，并能回到对应期数的周刊原文。
如果你不想从头翻阅整期周刊，而是只想快速找到 Figma 更新、UI 组件、网页灵感、图标库或 AI 工具，这个页面可以作为更直接的入口；筛选结果也会随着后续周刊更新持续补充。
资源库：https://moonvy.com/blog/resources/
ScrollTide 是一个面向 AI 网页开发的高端 UI 组件与网站模板库，提供 16 个独立组件、18 个页面区块和 79 个模板。内容覆盖 3D 轮播图、流畅画布网格、交互式卡片、粒子地球、动态按钮、Hero、CTA、Pricing、Footer 和 Contact 等场景，适合为网页加入更强的动效和沉浸感。
它的工作方式是复制提示词，粘贴到 Claude、Cursor 或 v0，再生成可以继续修改的页面。官网还标注了 React、Next.js、Tailwind、Framer Motion、GSAP、Three.js、WebGL、Shaders 和 Lenis 等技术方向，并提供对应的源代码与 AI 提示词。适合前端开发者快速探索高级交互，也适合作为设计师和开发者讨论 3D、滚动驱动动画与组件拆分方式的参考库。部分内容需要购买权限，使用前可以先查看免费条目和当前方案。
组件库：https://www.scrolltide.co/components
hairline 提供 27 个适合网页使用的等距线框插画，风格轻巧、留白充足，很适合用作展位图、封面、空状态或产品介绍中的视觉点缀。网站可以直接浏览不同 figures，并提供 SVG 文件、React 组件和原生 DOM 等使用方式。
它不依赖额外运行时，支持通过 npm、pnpm、yarn、bun 或 shadcn 安装，也可以结合配套 Skill 让 AI 生成和组合类似的等距线框插画。素材采用 MIT License，适合快速搭建一套统一的产品视觉插画语言。
官网：https://hairline.lucasmarkes.com/
GitHub：https://github.com/lucasmarkes/hairline
MotionSites AI 收集了一批可以直接用于 AI 建站工具的网页提示词，内容按 Apps、Sections 等类型整理，覆盖 Hero、Footer、Pricing、CTA、SaaS 和 Landing Page 等常见页面结构。网站的使用方式很直接：浏览案例，复制提示词，再粘贴到对应的 AI 工具里生成或调整页面。
除了提示词库，MotionSites 还提供 Animated Backgrounds、面向设计能力提升的 Academy，以及新的 MCP 入口。它更适合已经在使用 AI 生成网页、但希望有更具体视觉方向和版式参考的人：先从案例中找到合适的结构，再把提示词作为生成起点，最后回到自己的品牌、内容和组件规则里继续修改。
MCP：https://motionsites.ai/mcp
Bento Grids 是一个专门收集 Bento Grid 网格布局案例的灵感库。网站把来自产品官网、设计系统、品牌展示和营销页面的案例集中整理，点击卡片可以查看对应来源；同时支持按 Discover、Graphic Design、Web Design 和 Animation 等类别浏览，也可以筛选深色或浅色案例。
它适合用来研究如何把多块信息组织成有节奏的视觉结构：大卡片承担主要叙事，小卡片补充数据、功能或品牌细节，再通过尺寸、留白和对齐关系形成层次。网站还提供免费的 Bento 模板，适合在做产品首页、功能介绍或品牌展示时先搭出布局方向，再替换成自己的内容。
Regen Icons 是一个专为 Agent 构建界面准备的开源 SVG 图标系统，目前包含 225 个基于 24px 网格绘制的线性图标。仓库提供独立 SVG、React 组件、图标 Sprite 和可搜索目录，也包含部分封闭形状的 Filled 版本，图标可以直接复制到项目或拖进设计工具使用。
它的特别之处在于，图标不是只交付最终 SVG：每个图标都有对应的源文件和生成流程，仓库还提供代理用的 AGENTS.md、绘制规范与校验脚本，方便人和 Agent 继续扩展。当前可直接使用仓库里的 SVG，npm 包 regen-icons 还处于准备阶段；如果你增加或改进了图标，也欢迎把贡献回馈到仓库。
GitHub：https://github.com/kazdenc/regen-icons
MIT License：https://github.com/kazdenc/regen-icons/blob/main/LICENSE
APPLORE 是一个持续收集真实 App 图标的灵感与检索平台，目前展示 17,600+ 个来自 App Store 和 Google Play 的应用图标，并按颜色、风格和类别整理。它还会记录应用图标的历次改版，适合观察不同产品的品牌演进和视觉趋势。
除了浏览和搜索图标，APPLORE 还提供 AI 图标生成、手机预览和多尺寸导出等功能。设计师可以先从真实产品中寻找方向，再生成或验证自己的图标方案；做移动端产品、品牌探索、竞品分析或应用商店视觉设计时，都可以把它当作一个快速的图标参考库。
UIAble 是一套基于 shadcn、Base UI、Tailwind CSS 和 React 的组件系统，目标是帮助开发者更快搭建可扩展、可投入生产的应用界面。除了 Button、Input OTP、Switch、Toggle Group 等基础组件，它还提供表单、消息、文件上传、数据卡片、交易和个人资料等更接近真实产品的界面模式。
UIAble 的重点不只是组件数量，而是把组件、应用区块和完整使用场景放在同一套系统里，强调可访问性、代码所有权、主题定制和 AI 友好。它适合 Next.js、Tailwind 或 shadcn 项目作为起点：先用现成模式搭出信息结构，再把代码复制到自己的项目中继续调整，而不是被锁定在不可编辑的运行时里。
组件库：https://uiable.com/components
如果你正在构建 UI，Bencho 值得先保存下来。它收集了大量交互式 UI 组件，包括 Magnetic Select、Search、Escape Button、Create Menu、Radial Menu、Now Playing、Liquid Toggle、Checklist、Carousel、Pull to Refresh 和 Slide to Confirm 等模块；每个组件都可以直接在页面中试玩，也可以作为项目中的交互参考。
它和普通静态组件库的区别在于，重点不是展示最终截图，而是让设计师先体验交互，再决定哪些细节值得带进项目。网站支持搜索组件、打开声音效果，并提供 “Show me how” 的演示入口；注册后还可以保存自己喜欢的模块。适合用来寻找微交互灵感，或在和开发沟通交互状态时作为更直观的参考。
Footer.design 是一个专门整理网站 Footer 设计的灵感画廊。它把不同网站的页脚案例集中在一起，并提供 Typographic、Small Type、Illustrative、Grid、Flat、Animated、Cards、Bright 和 Dark 等风格分类，方便根据视觉方向快速筛选参考。
相比泛化的网页灵感站，这个网站把范围缩小到了页面最容易被忽略、但很影响收尾体验的区域。做官网、作品集或产品落地页时，可以从这里观察导航分组、品牌信息、社交链接、联系方式、CTA 和版权信息如何组合，再结合自己的内容密度与响应式布局重新组织。
浏览全部案例：https://www.footer.design/browse
CTA.gallery 是一个专门整理 Call-to-Action 设计的网页灵感库，收录按钮、购买、下载、表单、弹窗、导航、Newsletter 以及 Pricing / Subscription 等不同类型的 CTA 案例。网站还支持按行业和模式筛选，适合在设计转化路径或落地页关键节点时快速寻找参考。
它的价值不只是提供漂亮的按钮截图，而是把 CTA 放回具体页面和业务目标里观察：同样是“开始使用”或“了解更多”，可以对比不同网站如何处理文案、层级、颜色、留白、动效和周边信息。做营销页、产品官网或 SaaS 注册流程时，可以把这里的案例当作结构和表达方式的参考，再结合自己的用户路径重新设计。
CTA 写作提示：https://www.cta.gallery/cta-tips
404s.design 是一个专门收集创意 404 页面的网站灵感库。它把“页面不存在”这一特殊场景拆成可浏览的案例网格，并提供 3D、Bold、Brutalist、Colorful、Dark、Glitchy、Illustrative、Minimal、Playful、Typographic 等视觉风格筛选，还可以按 Animated、Custom Cursor、Game、Hover Effects 和 Interactive 等交互方式查找。
404 页面不只是错误提示，也可以成为品牌表达、引导回首页或发现其他内容的机会。这个画廊适合在设计网站异常状态时参考：观察插画、文案、动效、返回路径和内容推荐如何组合，让用户在迷路时仍然知道下一步该去哪里。
提交案例：https://www.404s.design/submit
agentmemory 是一个运行在本机上的持久化记忆系统，用来让 Coding Agent 跨会话保存、检索和整理上下文。它通过 Hooks 自动捕获会话、Prompt、工具调用和停止事件，再用 BM25、向量检索与知识图谱组合出 Recall 结果；安装后不需要外部数据库，状态保存在本地 JSON 中。
它提供 MCP 工具和 REST 接口，也带有可以查看实时观察流、历史会话、记忆内容和知识图谱的本地 Viewer。当前支持 Claude Code、Copilot CLI、Codex CLI、Cursor、OpenCode 等多种 Agent，安装方式可以直接使用 npx @agentmemory/agentmemory。如果你经常需要向 Agent 重复解释项目约定、技术决策和之前的排查结论，这类工具值得关注；不过实际接入前仍建议先确认本地数据存储、LLM Provider Key 和团队隐私要求。
官网：https://www.agent-memory.dev/
GitHub：https://github.com/rohitg00/agentmemory
Refero Styles 是一个面向 AI Agent 的设计系统示例库，收集了 2,000 多个产品网站的可读设计资料。打开任意风格后，可以查看颜色、字体、间距、组件和页面视觉特征，并获取一份可用于 Cursor、Claude Code、Codex、v0 或 Lovable 的 DESIGN.md。
网站支持按 Minimal Design、Clean SaaS、Editorial Type、Soft Gradients、Monochrome UI、Playful Design、High Contrast 和 Premium Design 等风格筛选，也可以按品牌、风格、颜色、字体或类别搜索。它适合在让 Agent 生成页面前先提供真实产品的设计上下文，把“做得好看”转化成更具体的颜色、排版、间距和组件约束。
官网：https://styles.refero.design/
设计资源：https://styles.refero.design/ai-agents/design-resources
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（moonvy.com）
2026-09-18 00:00:00
参与过设计交付的人，大概都有过这样的时刻。
打开一个项目，发现文件在 Figma 里；另一个项目用的是 Sketch；客户发来的文件，却来自 MasterGo、Pixso，甚至是 Photoshop 或 Illustrator。
工具本身没有对错。每个设计师都有自己的习惯，也有每个团队更适合的协作方式。有人喜欢 Figma 的协作体验，有人离不开 Sketch 的工作流，也有人已经在 MasterGo、Pixso 里积累了大量项目
但到了交付的时候，事情就变得有些麻烦了。
你需要确认对方使用什么工具，文件能不能打开，插件是否支持，预览是否正常。有时候，设计本身已经完成了，真正花时间的却是“怎么把它交出去”。
所以最近，我们给月维增加了一些新的设计软件支持。
现在，月维已经支持：
我们希望做的，不是让大家都使用同一种设计工具。
恰恰相反，我们更希望设计师可以继续使用自己熟悉的工具，而不必因为交付环节，被迫改变原来的工作方式。
从这个角度看，月维更像是站在不同设计工具之间的一层连接。
不管文件来自哪里，也不管接收方使用什么方式查看，设计资源都可以更顺利地被整理、分享和交付。
到现在，月维是支持交付软件较为全面的设计交付工具。
这件事听起来可能没有那么“热闹”。它不像一个全新的编辑器，也不是一个一眼就能看见的复杂功能。
但我们知道，很多真正影响工作体验的事情，往往发生在这些不太显眼的地方。 少一次格式转换，少一次重复上传，少一次“你那边能打开吗”的确认，项目推进就会顺利一点。
月维支持的，也不只是设计软件。
在一个完整的项目里，除了 Figma、Sketch 或 Photoshop 的源文件，还会有大量图片、PDF、Word 文档、GIF、动效和各种临时素材。
这些内容往往来自不同的工具，也分散在不同的文件夹里。为了确认一个文件的内容，大家经常需要反复下载，再切换到对应的软件中打开。
月维希望把这些常用的设计资源集中到一个地方，并尽可能支持在线预览。
不用下载，也不用为了看一眼文件，专门安装一个软件。
月维支持多种常见图片格式，包括 PNG、JPEG、GIF、BMP、SVG、TIFF、ICO 等。
一些相对新或不那么常见的格式，也可以直接预览，比如 AVIF、JXL 和 WEBP。
如果你使用苹果设备，照片里的 HEIC 格式也能正常查看；游戏项目里常见的 TGA 贴图，同样支持在线预览。
这些格式平时可能并不显眼，但真正遇到的时候，能够直接打开，就少了一次转换和来回确认。
设计团队里，除了最终交付的文件，也会积累大量原始文件。
不同阶段的 PSD、AI、FIG、XD、SKETCH 文件，可能记录着项目的过程、不同版本的尝试，以及一些暂时没有被采用、但未来仍有参考价值的方案。
如果这些源文件分散在个人电脑、聊天记录或不同的网盘里，时间久了，团队很难知道它们分别属于哪个项目，也很难重新利用过去积累的资源。
月维支持对 PSD、AI、FIG、XD、SKETCH 等主流设计源文件生成预览图，方便团队把各种原始文件集中整理在一起。
它目前主要用于缩略图和快速确认内容，不一定替代原本的设计软件，但可以帮助你快速判断：
这是哪个项目的文件？
它属于哪个阶段？
需要下载继续编辑，还是直接分享给别人？
当源文件被统一收纳、预览和整理之后，它们就不只是“做完项目后留下的文件”，也会逐渐成为团队可以持续使用的设计资源。
在 UI 设计中，动态素材也越来越常见。
页面转场、加载动画、交互动效、角色动作，往往都会和静态设计稿一起参与评审和交付。如果这些内容需要单独放在其他工具或文件夹里管理，查找和沟通都会变得不太方便。
所以，GIF、动效文件，以及 Spine 2D 骨骼动画，也可以直接放进月维，和设计文件、图片素材一起管理。
月维支持在线预览 Spine 2D 骨骼动画，还可以浏览和指定不同的动作与 Skin。
这样一来，设计稿、动态素材、源文件和参考图片可以放在同一个项目空间里。需要查看时直接打开，需要分享时也不必再重新整理一套文件。
我们希望月维承载的不只是某一种文件。
它可以是设计稿的交付空间，也可以是图片、文档、动效和源文件共同存在的项目资料库。
设计工具可以很多，文件格式也可以很多。
但查看、整理和分享这些内容，不应该因为格式不同，就变得复杂。
月维不要求你使用同一种工具。
只希望无论你用什么工具创作，最后都能更顺利地把成果交到需要它的人手里。
除了设计软件支持，这次我们还增加了一个新的分享方式：密码分享。
以前，分享设计灵感、设计方案或者设计 Demo 时，通常需要让对方登录月维，或者把资源设置成完全公开。
现在，你可以直接为分享内容设置访问密码。
生成分享链接后，只需要把链接和密码一起发给对方，对方无需登录月维，输入密码就可以访问。
这比较适合以下场景：
功能入口也很简单：
有时候，我们只是想把一个文件夹发给别人看一眼，并不希望对方为了这一次查看，专门注册一个账号。
现在，这个过程可以简单一点。
设计工具可以很多，分享方式也可以有很多种。月维想做的事情，一直不是替大家决定应该怎么工作，而是尽量把交付过程里的那些小障碍，一个个减少。
让设计师继续用自己习惯的工具，让团队把设计稿、源文件和各种素材放在一起， 也让设计资源在需要到达的人手里时，少绕一点路。
月维，继续帮你管理和交付设计资源。https://moonvy.com/
2026-09-07 00:00:00
Figma 在 2026 年 9 月 3 日的更新中，增加了在变量面板里批量控制不透明度的能力。不需要解除颜色变量的链接，就可以在颜色之上叠加不透明度；也可以使用数字变量设置不透明度，并将它限定为颜色变量使用。
这让禁用状态、遮罩层和 scrim 等场景的透明度可以统一管理和批量更新，颜色变量仍然保持与设计系统的关联，不必再逐个手动调整。
官方记录：https://www.figma.com/release-notes/
Figma 在 Config 发布自定义生成式插件和着色器之后，又补充了动画与交互、社区发布、组织内发布、代码查看器等能力。现在可以让 Agent 创建带动画、能够响应鼠标移动的着色器效果，也可以把生成式插件和着色器发布到 Figma Community，供其他人使用和 remix。
此外，用户可以直接查看和下载着色器以及自己创建的生成式插件代码；通过 Figma MCP，第三方 Agent 也能查看和修改这些生成式插件与着色器。组织版和企业版还支持将私有资源发布到组织内部统一使用。
官方记录：https://www.figma.com/release-notes/
Figma Draw 最近把两个很熟悉的绘图工具带回了矢量编辑流程：橡皮擦可以直接擦掉路径或形状的一部分，油漆桶则可以为封闭区域填充纯色或渐变，也可以拖动一次修改多个区域的颜色。
橡皮擦不会把对象简单地变成一张位图，而是会在擦除位置生成新的可编辑矢量点；油漆桶也保留在同一个矢量网络里。对于做图标、插画、贴纸和图形 Logo 的设计师来说，这种操作比反复切割路径更接近手绘时的直觉。快捷键是 Shift + E 切换橡皮擦，Shift + B 使用油漆桶。
功能说明：https://help.figma.com/hc/en-us/articles/360039957634-Edit-vector-layers
更新记录：https://www.figma.com/release-notes/
Figma MCP 的企业托管授权现在已经正式开放。组织管理员可以通过身份提供商集中管理 MCP Server 与 AI Agent 的连接，成员不需要每个人都重复走 OAuth 登录和授权流程。
当前文档以 Okta Cross App Access 为例：成员通过企业身份系统登录一次，Claude 就可以在组织批准的范围内使用 Figma MCP。它解决的不是“如何让 Agent 读到设计稿”，而是团队规模变大以后，如何把权限、登录和审计纳入原有的 IT 管理流程。这个功能目前适用于 Organization 和 Enterprise 计划，并且文档注明支持 Anthropic models。
Figma 的 Auto Layout 新增了 Around 和 Evenly 两种自动间距方式，并把原本的默认方式重新命名为 Between。三个选项分别对应 CSS 中常见的 space-between、space-around 和 space-evenly 逻辑。
Between 只在元素之间分配间距，边缘不留额外空间；Around 会在每个元素两侧分配空间，边缘间距是中间间距的一半；Evenly 则让元素之间以及两端的间距完全一致。对于需要从设计稿直接还原到 Flexbox 的界面，这种命名和行为的统一能减少“看起来差不多、代码却要重新猜”的情况。
官方说明：https://www.figma.com/release-notes/
Anthropic 把 Claude Design 的画板工作流带进了 Claude Code。输入 /design 后，Claude 会先生成多个可编辑的界面方案，设计师可以挑选一个、直接在画布上调整，再让 Agent 按这个版本继续实现，而不是从一句模糊 Prompt 直接跳到代码。
它适合用在还没有确定布局的功能：先比较几个方向，再把选中的画板交给现有代码库。Claude Design 的更新说明还提到，/design-sync 可以把设计系统带入工作流，尽量沿用已有组件和规则。需要注意的是，/design 目前仍属于研究预览，使用时最好把它当作快速探索和沟通工具，关键的组件、交互和无障碍细节仍然要自己验收。
官方介绍：https://claude.com/blog/claude-design-stays-on-brand-for-daily-work
MetalForge 是一个面向 SwiftUI 和 React Native 的 Shader 可视化编辑器，不需要先写 Metal 或 GLSL，就可以通过滑块调整效果，再预览并分享参数 URL。它支持导出真正的 .metal 文件、SwiftUI View，以及 React Native（Skia）Shader，适合用来制作更有质感的加载、进度和 Agent 工作状态动画。
预览：https://metalforge.xyz/editor#tool=progress
Better Design 是一套面向 coding agent 的设计系统与 MCP 工具。它提供设计系统、界面原则、UX 指导、图标、素材和审查规则，目标是让 Agent 在生成页面时先读取设计上下文，并在修改代码后继续做设计层面的检查。
它和普通组件库的区别在于：组件只是“能用什么”，而设计指导还要回答“什么时候用、如何组合、怎样判断结果是否合理”。如果你已经在使用 v0、Claude Code 或其他 MCP 客户端，可以把它当成一层独立的设计顾问；项目主页还提供了可以直接安装到编辑器的 MCP。
对比说明：https://better-design.com/vs/v0
Sync UI 最近发布了 Charts，包含 Bar、Donut、Heatmap、Line、Progress 和 Stat 等常见图表，组件带有动画、主题变量和深色模式，并且 CLI 与 MCP 已经同步支持。
它适合用在需要快速搭建后台、数据产品或 AI 工作台的项目里：图表和其他组件采用同一套 syncui add 工作流，不需要额外引入一套完全不同的图表 API。图表可以继续使用项目自己的 Token 做主题化，比较适合先快速搭出信息结构，再回到代码里调整数据密度、动画和交互。
更新记录：https://www.syncui.design/docs/changelog
Logo Lattice 是一个浏览器里的 Logo 编辑器，围绕方格和等距网格来绘制几何 Logo，支持 SVG 和 PNG 导出。最近的更新包括 SVG 描边圆角、等距绘制、可自定义 PNG 尺寸，以及更清晰的网格绘制引导。
它不是用来替代 Illustrator 的完整矢量软件，而是把“从几何约束出发做一个小 Logo”这件事做得更直接。想练习图形构成、快速做一个 App 图标，或给一个新项目先建立几个方向时，都可以打开它试试。免费浏览和编辑，部分 Studio 功能需要订阅。
更新记录：https://logolattice.com/change-log
Superflow 是一个面向网站和数字资产的 AI Review 工具。它可以把团队已有的 QA 清单变成多个审核 Agent，检查断链、拼写、基础无障碍、SEO，以及品牌颜色和字体是否符合规范；发现问题后会把评论固定在页面元素上，而不是只给一份难以定位的报告。
它保留了 human-in-the-loop：AI 负责第一轮检查，团队和客户仍然需要确认、修改和签字。对于设计师和小型工作室来说，比较实用的地方是把“交付前再看一遍”的经验变成可重复执行的流程，尤其适合同时维护多个网站或营销页面的场景。
FeralUI Gradients 是一个免费的在线渐变生成器，使用传统日式色彩来组合柔和、带有绘画感的渐变。选择渐变类型、混合颜色和边缘衰减后，可以实时预览结果，不需要注册，也不会添加水印。
它提供了 20 多种类型，包括动态 Mesh、颗粒感复古 Blob、Aurora 光带、Wave，以及线性、径向、锥形和像素网格等渐变。静态效果可以导出为 SVG 或 PNG，动态效果可以导出为 MP4；复制 SVG 后，还能直接粘贴到 Figma，并作为带名称的可编辑图层继续调整。
在线使用：https://feralui.dev/gradients
Mesurer 是一款基于浏览器的 UI Inspector，适合在开发过程中直接检查页面界面。安装 Chrome 扩展后，可以选取页面元素查看尺寸、间距和对齐关系，也支持像素标尺、横竖辅助线、按住 Alt 快速检查间距、颜色取样、文字样式检查和 X-ray 结构查看。
它还可以截取当前可见区域，并复制到剪贴板或下载到本地。对于设计还原、像素级验收，或者需要给 coding agent 提供更精确视觉反馈的场景，Mesurer 能把“这里差一点”变成更具体的测量结果和截图标注。
UI Camera 是一个在浏览器里制作软件产品视觉素材的工具。上传 PNG、JPG、WEBP、AVIF、GIF，或 MP4、MOV、WEBM 后，可以像操作一台 3D 相机一样调整 X、Y、Z 视角，选择 16:9 等画幅，并在图片和视频模式之间切换。
它适合把普通的 UI 截图变成更有空间感的产品展示图或演示视频，用于产品介绍、案例展示和社交媒体配图。调整好角度后还能直接截取 PNG，整个过程比较适合快速做出一组风格统一的界面视觉。
Circle Loaders 收集了 24 个黑白风格的圆形加载动画，全部使用原生 SVG 制作，不依赖任何 JavaScript 或第三方库。每个动画都可以直接复制 SVG 代码，适合放进网页、应用加载状态、AI Agent 处理中状态和各种空状态界面。
它的细节很适合拿来做微交互参考：同样是圆形，既可以用旋转、分段、扫描和呼吸感表达“正在等待”，也可以用更有节奏的变化表现 Agent 正在工作。网站还提供了面向开发者的复制入口，使用时可以先确认动画的尺寸、颜色和 prefers-reduced-motion 处理是否符合自己的项目。
在线浏览：https://circleloaders.dominikakissi.com
更多内容：https://shoogle.dev/fresh
Ambient CSS 是一个基于物理光照的 CSS 系统。只需要定义光源，阴影、高光和表面渐变就会根据同一套光照关系自动变化；它参考 Blender 的光线追踪结果进行校准，最终使用 CSS box-shadow 渲染。
它适合用来理解界面中的光照方向、阴影层次和表面质感，也可以作为制作卡片、按钮和悬浮面板视觉效果的参考。相比单独调整多层阴影，这种方式更容易让同一组组件保持一致的光照逻辑。
在线体验：https://ambientcss.vercel.app/
Aura Gradients 是一个免费的氛围渐变素材库，使用分层渐变和 CSS 混合模式制作柔和、带有空间感的背景。网站目前收录 200 多个渐变，提供 Aura、Mesh、Nebula、Prism、Lattice、Grain、Glass 和 Flux 等分类。
每个渐变都可以先预览，再进入自定义编辑，也支持复制 Prompt，适合快速为网站、产品界面或作品集寻找背景方向。项目开源，动画渐变和更多自定义能力也在持续开发中。
在线浏览：https://auragradients.vercel.app/
很有意思的手绘动画图标库，每个图标都有活泼的小动画，手绘感很强，很适合用在一些偏个性、轻松有趣的产品或网页中。
图标支持导出为 Animated SVG，也可以放到 Figma 中继续编辑。目前已经制作了约 150 个图标，作者 计划后续扩充到 1500 个，值得持续关注。
网站：https://oreoui.com/doodle-icons
Github：https://github.com/oreo-design/doodle-icons
很适合日常逛的设计灵感库，收集了来自互联网的优秀视觉设计作品，涵盖 Web、品牌、产品、动效、插画、3D、印刷等多个分类。
网站整体很干净，可以直接按分类筛选，适合找项目灵感、做 Moodboard，或者没事的时候随手刷刷最近的好设计。内容还会持续更新。
网站：https://www.inspora.design/
Moonvy 月维是一款专业的「设计资源管理工具」，让设计图的管理与交付在浏览器中就能轻松完成。提供更高效的切图、标注体验，并支持多种开发代码格式，让设计交付更省心、更顺畅。（moonvy.com）
2026-08-25 00:00:00
Moonvy 月维是一款面向设计团队的设计资源管理与交付工具。
它可以把设计文件、设计交付、团队协作和版本管理放在同一个地方完成。设计师可以从 Figma、Sketch、即时设计或 Photoshop 上传设计资源，产品和开发成员则可以直接查看设计图、标注、切图和代码。
本文按照月维目前的产品页面整理主要功能、套餐信息和插件支持情况。价格和套餐权益可能会调整，具体以官网价格页当前显示为准。
| 功能模块 | 主要能力 | 适合场景 |
|---|---|---|
| 设计交付 | 设计图标注、图层查看、尺寸与样式查看、代码查看 | 设计师向产品和开发交付设计稿 |
| 切图导出 | 多格式切图、重复切图识别、PNG 压缩、复制 SVG 代码 | 下载图片资源和前端开发 |
| 文件管理 | 多种格式在线预览、多级文件夹、文件属性、标签和颜色检索 | 归档和查找团队设计资产 |
| 视图管理 | 图标视图、画布视图等多种方式查看文件 | 整理设计稿、素材和项目文件 |
| 团队协作 | 评论、备注、在线成员、文件分享、附加链接 | 方案评审和日常沟通 |
| 团队管理 | 成员邀请、项目管理、权限设置、项目动态 | 管理不同项目和协作成员 |
| 个性化设置 | 黑夜模式、缩放习惯、剪贴板上传、复制图片到剪贴板 | 按个人习惯使用月维 |
月维的设计交付功能主要服务于设计师、产品经理和开发者之间的协作。
| 交付功能 | 说明 |
|---|---|
| 设计图标注 | 查看图层尺寸、位置、间距、颜色、字体、填充、描边和投影等信息 |
| 图层查看 | 显示图层结构和图层轮廓，快速理解页面布局 |
| 代码查看 | 根据设计图查看多种代码格式，方便工程师实现页面 |
| 自动布局与变量 | 识别 Figma 自动布局和设计变量等信息 |
| 切图导出 | 支持多种切图格式，并可切换设计倍数和开发平台单位 |
| 图片优化 | 对 PNG 切图进行压缩，减少资源体积 |
| SVG 代码 | 无需下载文件，直接复制 SVG 代码 |
在查看设计标注时，可以根据开发平台切换代码类型：
| 开发平台 | 支持的代码类型 |
|---|---|
| Web |
CSS、CSS in JS、CSS in HTML、Tailwind、UnoCSS
|
| Android |
Android XML、Android Compose
|
| Apple |
iOS SwiftUI、iOS UIKit Swift、iOS Objective-C
|
| 跨平台 |
Qt Style Sheets、Qt QML
|
月维不只是一次性的设计交付工具，也可以用来长期管理团队设计资源。
| 场景 | 月维提供的能力 |
|---|---|
| 资源归档 | 图片、视频、动画、PSD、AI、Sketch、Figma 等资源可以集中管理 |
| 文件查找 | 使用文件夹、标签、颜色和多种视图快速定位资源 |
| 版本管理 | 保留设计图历史版本，方便查看更新记录和恢复旧方案 |
| 文件预览 | 直接在浏览器中预览图片、视频、动画、Word、Excel、PPT 和部分设计源文件 |
| 方案评审 | 给文件添加评论、备注和外部链接，保留讨论过程 |
| 客户分享 | 通过分享链接和访问密码，让未注册用户查看设计方案 |
| 团队协作 | 邀请成员加入项目，按不同权限参与上传、编辑、下载和交付 |
| 文件类型 | 支持格式 | 查看说明 |
|---|---|---|
| 图片 |
PNG、JPEG、BMP、SVG、TIFF、ICO、AVIF、JXL、WebP、HEIC、TGA
|
在线预览图片 |
| 动画 |
GIF、Lottie JSON、RIV、PAG
|
在线预览动画效果 |
| 办公文档 |
DOC、DOCX、XLS、XLSX、PPT、PPTX
|
在线预览 Word 文档、Excel 表格和 PowerPoint 演示文稿 |
| 设计源文件 |
PSD、AI、FIG、XD、SKETCH
|
支持预览缩略图 |
| 视频 |
MP4、WebM
|
能否播放取决于浏览器支持情况 |
| 骨骼动画 | Spine 2D |
在线预览骨骼动画，并查看动作与 Skin |
| Axure 原型 | Axure 导出的 HTML 文件 | 支持托管并查看原型交互 |
以下价格按官网目前的年度套餐信息整理。价格可能因活动、支付方式或产品调整发生变化，购买前请以月维价格页为准。
| 套餐 | 协作成员 | 访客数量 | 团队容量 | 价格参考 |
|---|---|---|---|---|
| 免费版 | 10 人以内 | 50 人 | 1 GB 起 | 免费 |
| 专业版 | 20 人 | 100 人 | 40 GB 起 | ¥69 / 人 / 年 |
| 企业版 | 21 人及以上 | 500 人 | 100 GB 起 | ¥188 / 人 / 年 |
| 个人大会员 | 仅限(免费团队) + 1 人 | — | + 10 GB | ￥159 / 年 |
| 类型 | 可以做什么 | 是否占用协作成员额度 |
|---|---|---|
| 协作成员 | 上传、编辑、下载资源，查看标注并生成代码 | 是 |
| 访客 | 浏览团队资源和设计内容 | 否 |
如果一个成员只需要查看设计稿，不需要编辑、下载资源或生成标注代码，可以将其设置为访客，从而减少团队的协作成员占用。
月维支持单独购买容量包。容量包适合团队成员数量不变，但设计文件、视频或源文件不断增加的情况。
容量包支持叠加使用，可以根据团队实际需要分次购买。作为参考，1 GB ≈ 1600 张 APP 设计图，实际数量会因设计图尺寸和文件大小有所不同。对于大多数团队来说，20 GB 容量包是更推荐的选择，通常可以满足日常设计资源、视频和源文件的存储需求。
| 容量包 | 适合场景 | 价格 |
|---|---|---|
| 2 GB 容量包 | 补充少量设计资源空间 | ￥39 / 年 |
| 20 GB 容量包 | 推荐大多数团队使用，存储较多设计源文件、视频和项目资料 | ￥299 / 年 |
月维通过插件连接设计工具和在线交付空间。设计师可以在熟悉的设计工具中上传设计图，再在月维中完成标注、切图和代码查看。
| 设计工具 | 插件状态 | 支持情况 | 入口 |
|---|---|---|---|
| Figma | 已支持 | 上传设计图并进行设计交付 | 安装 Figma 插件 |
| Sketch | 已支持 | 支持 Sketch 72 及以上版本 | 下载 Sketch 插件 |
| 即时设计 | 已支持 | 在即时设计中上传设计稿到月维 | 安装即时设计插件 |
| Photoshop | 已支持 | 支持 Photoshop 2024（v25）及以上版本 | 下载 Photoshop 插件 |
| Illustrator | 已支持 | 使用 Illustrator 上传设计稿到月维 | 下载 Illustrator 插件 |
插件的具体安装方式和版本要求，建议前往月维插件下载页查看。
| 步骤 | 参与者 | 操作 |
|---|---|---|
| 1 | 设计师 | 在 Figma、Sketch、即时设计或 Photoshop 中完成设计 |
| 2 | 设计师 | 使用月维插件上传设计稿和资源 |
| 3 | 产品经理 | 在月维中预览设计方案并添加评论或备注 |
| 4 | 开发者 | 查看尺寸、颜色、字体、切图和代码信息 |
| 5 | 团队成员 | 通过版本记录追踪修改，并在同一个项目中持续协作 |
| 使用情况 | 推荐选择 | 原因 |
|---|---|---|
| 个人使用，偶尔交付设计稿 | 免费版或个人大会员 | 先使用基础功能，空间不足时再增加容量 |
| 10 人以内的小团队 | 免费版 | 免费使用主要协作能力，适合设计师、产品和开发组成的团队 |
| 11–20 人、需要稳定协作的团队 | 专业版 | 专业版从 11 人起，增加协作成员和团队容量，适合持续交付项目 |
| 21 人及以上、资源量较大的团队 | 企业版 | 支持更多成员和更大的团队资源空间 |
如果你正在寻找一款可以同时完成设计资源管理和设计交付的工具，可以先从免费注册月维开始，再根据团队规模和存储需求选择合适的套餐。
2026-08-25 00:00:00
10 人以内团队，目前可以免费使用月维。
对于还处在早期阶段的团队，可以先使用基础的项目管理、设计交付和资源协作能力。
团队本身就会不断变化：今天可能只有 3 个人，下个月加入一名前端，过一段时间又增加一名产品经理。
团队可以根据成员规模、存储空间和项目需求，逐步选择适合自己的服务方案。
这也是月维目前坚持的方式：
先让小团队把项目跑起来，再根据实际需求逐步升级。
如果你还没有使用过月维，可以把它理解为一个：
设计资源管理 + 设计交付 + 团队协作工具。
除了查看设计稿、标注、切图和查看代码，月维还希望解决一个长期存在的问题：
很多团队的设计资源分散在电脑、网盘、聊天记录、设计工具和各种临时文件夹中。
时间一长，就容易出现这些问题：
所以，月维从一开始就不只是关注「把设计稿交付出去」，也希望帮助团队长期整理和沉淀设计资产。
目前，月维可以统一管理：
图片、PSD、AI、Sketch、Figma、Word、Excel、PPT、视频、动画等多种设计资源。
很多设计源文件还可以直接查看缩略图和文件信息，不必每次下载到本地再打开确认。
设计稿上传到月维后，可以直接完成：
标注、切图、代码查看、颜色与变量查看、历史版本管理等操作。
设计和开发之间，不必再为了一个尺寸、一张切图或一段样式代码反复沟通。
设计稿更新后，历史版本也会继续保留。
谁改了什么、哪个版本是之前的方案，都可以继续追溯。
简单来说：
从设计资源管理到设计交付，团队可以在同一个地方完成协作。
除了团队内部协作，月维也支持多种分享方式。
比如「密码分享」可以把设计灵感、设计方案和 Demo 直接分享给客户或其他协作者。
对方无需注册月维账号，打开链接并输入访问密码即可查看。
对于客户预览、方案评审和临时分享等场景，会更加方便。
很多真正需要设计协作的团队，其实并没有那么大。
比如，一个典型的小型产品团队可能包括：
一共 8 个人。
在月维里，这样的团队目前依然可以免费使用。
团队可以创建项目、整理设计资源、上传设计稿、进行标注和切图，也可以邀请成员一起协作。
免费版可以满足小团队日常的资源管理、设计交付和团队协作需要。
当然，随着团队规模扩大，对存储空间、权限管理、协作人数和服务能力的需求也会增加。
到了那个阶段，再根据实际规模选择合适的付费方案，是很自然的事情。
但在团队还只有几个人时，我们更希望大家先把工具用起来：把项目跑起来，把设计资源管理起来，等团队真的长大了，再考虑更大的方案。
这也是月维目前对团队定价的基本思路：团队可以慢慢长大，成本也应该逐步增加。
如果你正在寻找一款可以同时完成设计资源管理、设计交付和团队协作的工具，可以试试月维。
10 人以内团队，目前免费使用。
不只是完成一次设计交付，也可以把散落在各个地方的资源，慢慢整理成真正属于团队的设计资产。
如果你想进一步了解月维的完整功能、套餐价格和适用人群，可以继续阅读：《月维是什么？功能、价格与适用人群一篇讲清楚》。
