Advertisement

Figma Batch Styler：批量编辑文本样式的Figma插件

  •  5星
  •     浏览量: 0
  •     大小:None
  •      文件类型：None

简介：
Figma Batch Styler是一款专为设计师打造的Figma插件，能够高效地进行文本样式的批量编辑和管理，极大提升设计工作的效率与灵活性。 在批处理样式器中运行 `npm install` 和 `npm run build` 命令后，在 Figma 中选择 New Plugin 并通过 Link existing from manifest.json 选项链接现有的插件文件，然后从 public/manifest.json 文件进行选择。

全部评论 (0)

还没有任何评论哟~
客服
客服
客服关闭
  • Figma Batch Styler：批量编辑文本样式的Figma插件
    优质
    Figma Batch Styler是一款专为设计师打造的Figma插件，能够高效地进行文本样式的批量编辑和管理，极大提升设计工作的效率与灵活性。 在批处理样式器中运行 `npm install` 和 `npm run build` 命令后，在 Figma 中选择 New Plugin 并通过 Link existing from manifest.json 选项链接现有的插件文件，然后从 public/manifest.json 文件进行选择。
     
  • to-path-figma：将对象和文本转换为路径的Figma插件
    优质
    To-path-Figma是一款实用的插件，专门用于将Figma设计中的对象和文本直接转化为矢量路径，极大地提升了设计师的工作效率与创意发挥空间。 到路径：Figma插件 :sparkles:
     
  • Figma Table Creator：一款简洁的Figma插件，用于生成灵活可编辑的表格
    优质
    Figma Table Creator是一款专为设计师打造的高效插件，可在Figma中轻松创建和编辑灵活多变的表格，极大提升工作效率。 表创建者可以灵活地创建和管理表格。要开始，请进入Plugins > Table Creator > Create Table，并点击Create Components。然后输入所需的列数与行数（最多50列及行），并单击“创建表”按钮。 编辑单元格文本时，只需按住CMD/CTRL键并在单元格中心双击即可。选择多个单元格的方法是：先用鼠标选中一个或几个单元格，再按住SHIFT + CMD/CTRL，并继续拖动以扩大选择范围；或者使用Plugins > Table Creator > Select Column 或 Select Row 插件来快速选择整列或整行。 调整表格大小和重新排列内容时，请首先通过上述方法选定要修改的列或行。然后运行相应的插件命令，即可对选中部分进行操作，如改变宽度、移动位置等。 此外，“Select Column” 和 “Select Row” 插件还支持整个表格尺寸的一键调节功能。
     
  • Figma-Vue3-模板：基于Vue3的Figma插件模板
    优质
    本项目提供一个基于Vue3框架的Figma插件开发模板，旨在帮助开发者快速搭建和扩展功能丰富的Figma插件应用。 Vue公司3插件模板FIGMA 这个模板可以让你在很短的时间内使用Vue3框架来构建Figma插件。特点包括： Vue 打字稿集成消息处理的辅助功能，以简化主代码与UI代码之间的通信。直播服务器预览使构建UI更快。 要开始，请安装依赖项通过运行 `npm i` 。然后执行命令 `npm run dev` ，这将创建一个名为dist的文件夹。在Figma桌面应用程序中，点击新建插件按钮，并使用此模板来快速搭建和开发你的Vue3 Figma插件项目。 如果您想要为自己的GitHub仓库克隆这个模板，请按照以下步骤操作：使用该命令 `gh repo create --template https://github.com/LukeFinch/Figma-Vue3-Template` 创建一个新的基于此模板的仓库。
     
  • HTML-Figma：一款可将HTML导入Figma图层的插件-源码
    优质
    HTML-Figma是一款专为设计师打造的插件，它能够轻松地将HTML代码转换并导入至Figma的设计文件中，极大地方便了前端开发与设计工作的衔接。该插件提供完整的源代码，便于用户进行二次开发和定制。 HTML <-> Figma插件可以将网页上的HTML内容转换为Figma设计文件或从Figma设计生成代码。 使用方法如下： 在Figma中打开一个新文档或者现有文档，然后按下 `cmd + /` 并搜索“html figma”，接着点击Enter键。输入您要导入的URL地址即可轻松获取现场样式的实际效果作为设计和原型的基础。 该插件的优点包括： - 轻松将真实网站样式导入Figma - 快速地把网页组件转化为设计元素，便于使用故事书等工具进行后续开发工作。 - 支持捕获需要身份验证或者特定状态下的页面内容 此外，还可以通过Node.js安装@builder.io/html-to-figma插件来实现从HTML到Figma的转换。例如： ```javascript import { htmlToFigma } from @builder.io/html-to-figma; const layers = htmlToFigma(document.body); ``` 以上代码可以将网页元素转为适合上传至Figma的设计图层，或者通过REST API发送给服务器端以生成.figman.json文件形式。
     
  • Figma-Export-Zip：便捷地将Figma资产打包成.zip文件
    优质
    Figma-Export-Zip是一款工具插件，旨在帮助用户轻松快捷地将Figma设计项目中的各类资源导出为统一的.zip格式文件，极大提升了团队协作和设计交付效率。 Figma导出.zip :package: 轻松将Figma中的资产直接导出到.zip文件中。 用法： 在Figma中选择任何东西。 按Command键然后搜索“导出.zip”。 运行插件，您的选择和所有导出设置将被使用。 通过按下 Command + Shift + P 立即重新运行插件。 安装和贡献： 克隆存储库：git clone https://github.com/brianlovin/figma-export-zip.git 转到目录：cd figma-export-zip 安装figplug：npm i -g figplug 安装软件包：npm install 构建插件：figplug build -w -o=build 向Figma添加一个新的开发插件，选择figma-export-zip/build/manifest.json文件作为清单。
     
  • Figma设计软件的桌面版本
    优质
    Figma Design Software的桌面版本为设计师提供了一个强大的本地工作环境，支持高效率的设计与协作。 Figma 是一个可以免费替代 Sketch 的软件，它拥有丰富的插件、良好的兼容性，并且可以在网页端和客户端使用。其功能涵盖了大部分 Sketch 操作，非常实用。
     
  • Figma-Chinese-Font-Picker：Figma中的中文字体挑选插件
    优质
    Figma-Chinese-Font-Picker是一款专为Figma设计的中文插件，帮助用户轻松挑选和使用各种中文字体，提升工作效率与设计质量。 Chinese Font Picker是Figma中的一个中文字体选择插件。 开发与安装： - 安装依赖包：`npm i` - 开发模式运行插件：`yarn start` - 生产环境构建：`yarn build`
     
  • Anima: 从Figma到代码（React/HTML）- crx插件
    优质
    Anima: 从Figma到代码（React/HTML） 是一款Chrome扩展程序插件，它能自动将Figma的设计文件转换为高质量的React或HTML/CSS代码，大大提高了前端开发的工作效率。 Hey, busy developers! :waving_hand: The Anima Chrome extension for Figma is the simplest way to get developer-friendly HTML and React code directly from within Figma. With this Chrome extension, you can: - Select Figma design components and export clean, developer-friendly code. - Export code straight from Figma in your browser. - Save time by minimizing tedious work while maintaining control over your code without compromising its appearance. Simply install the Anima Figma Chrome Extension and open it within Figma to find the export button!
     
  • 通过CLI从Figma项目中导出SVG (export-figma-svg)
    优质
    export-figma-svg是一款用于通过命令行接口（CLI）直接从Figma设计项目中高效提取SVG文件的工具。它简化了设计师和开发人员之间的协作流程，使得资源管理更加便捷。 通过CLI从Figma导出SVG入门 使用命令行接口（CLI）可以轻松地将Figma项目中的SVG文件导出出来。 前提条件： 您需要一个DEV_TOKEN（请参阅设置的第5步） 图标管理： 每个图标都是一个Figma组件。选择对应的图标并使用快捷键⌥⌘K来应用。 输出目录： 生成的SVG文件将会保存在src/svg文件夹中 步骤说明： 1. 安装依赖：运行 `yarn install` 2. 选择包含图标的框架，并复制该框架的URL 3. 运行命令`node src/setupEnv.js`，当提示时粘贴从第2步获取到的URL。这一步会生成一个.env文件。 4. 在Figma中通过“帮助和帐户”>“账户设置”>“个人访问令牌”的路径来创建DEV_TOKEN（也称为个人访问令牌）。 5. 将刚刚创建好的DEV_TOKEN添加至步骤3自动生成的.env文件里。 完成以上步骤后，就可以使用CLI从Figma导出SVG了。