Advertisement

Figma-Export:一款用于从Figma导出颜色、版式、图标和图片至Xcode及Android Studio的命令行工具

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


简介:
Figma-Export是一款便捷的命令行工具,专为设计师与开发者设计。它能轻松地将Figma中的颜色、字体样式、图标和图片等资源导出到Xcode和Android Studio中,极大提高了开发效率。 FigmaExport是一款命令行实用程序,能够将Figma中的颜色、排版、图标及图像导出到Xcode或Android Studio项目中。 - 颜色:从Figma的颜色样式导出。 - 排版:支持从Figma的文字样式进行导出。 - 图标:可以导出带有小黑色矢量图的Figma组件。 - 图像:能够将包含浅色和深色模式下的彩色图像的Figma组件导出。 该实用程序适用于暗模式,并且兼容SwiftUI。开发这款工具的原因是,目前Figma不支持直接向Xcode或Android Studio项目中导出色彩与图片信息,手动导出会耗费大量时间。此外,它可以帮助保持组件库和代码之间的同步性。

全部评论 (0)

还没有任何评论哟~
客服
客服
  • Figma-ExportFigmaXcodeAndroid Studio
    优质
    Figma-Export是一款便捷的命令行工具,专为设计师与开发者设计。它能轻松地将Figma中的颜色、字体样式、图标和图片等资源导出到Xcode和Android Studio中,极大提高了开发效率。 FigmaExport是一款命令行实用程序,能够将Figma中的颜色、排版、图标及图像导出到Xcode或Android Studio项目中。 - 颜色:从Figma的颜色样式导出。 - 排版:支持从Figma的文字样式进行导出。 - 图标:可以导出带有小黑色矢量图的Figma组件。 - 图像:能够将包含浅色和深色模式下的彩色图像的Figma组件导出。 该实用程序适用于暗模式,并且兼容SwiftUI。开发这款工具的原因是,目前Figma不支持直接向Xcode或Android Studio项目中导出色彩与图片信息,手动导出会耗费大量时间。此外,它可以帮助保持组件库和代码之间的同步性。
  • 通过CLIFigma项目中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了。
  • Fugen:,帮助Figma文件中资源生成代码
    优质
    Fugen是一款强大的命令行工具,专为开发者设计,能够直接从Figma文件中高效地导出资源并自动生成代码,大幅提升开发效率。 Fugen 是一个用于从文件生成代码并导出资源的命令行工具。当前支持以下实体: - 颜色样式 - 文字样式 - 阴影样式 安装方法: 使用 CocoaPods 安装 Fugen,请在 Podfile 中添加一行:`pod Fugen, ~> 1.3.0` 然后运行命令 `$ pod install --repo-update` 如果通过 Homebrew 安装,执行以下操作: ``` $ brew install almazrafi/tap/fugen ``` 建议使用 CocoaPods 进行安装,因为它可以在所有团队成员的计算机上设定固定版本并自动完成更新过程。
  • Figma-Export-Icons:利Figma REST API将SVG入项目中
    优质
    Figma-Export-Icons是一款工具,它通过使用Figma的REST API自动将SVG格式的图标文件直接集成到设计项目中,简化了工作流程。 Figma-export-icons 是一个命令行脚本工具,用于通过 Figma REST API 从 Figma 文件导出并下载图标。运行该脚本会弹出向导以填写获取资产所需的配置信息。您也可以提供自己的 `icons-config.json` 配置文件来跳过这个向导步骤。 在完成配置后,系统将解析 Figma 文件找到图标框架,并根据提供的目录路径进行本地保存。示例配置如下: ```json { figmaPersonalToken: YOUR_PERSONAL_TOKEN, fileId: FILE_ID, page: Identity, frame: Icons, iconsPath: ./assets/svg/icons } ``` 脚本的主要特征包括向导生成配置,如果存在缺失的密钥信息,系统将提示用户输入。
  • HTML-Figma可将HTMLFigma插件-源码
    优质
    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文件形式。
  • FigmaConvertXib: 个将Figma设计元素并生成项目
    优质
    FigmaConvertXib是一款高效的开发辅助工具,能够自动将Figma中的设计元素导出,并直接集成到项目中,简化工作流程。 FigmaConvertXib 是一款工具,用于从导出的设计元素生成文件并将其添加到项目中。它可以将设计元素转换为iOS项目的 .xib 文件或Android Studio 项目的 .xml 文件。 使用前请观看带有示例的视频教程。 - 添加 Figma 项目 - 设置页面类型 安装: 基本参数 在每个步骤生成时,会用到以下基本参数: accessToken:用于执行Figma API请求的访问令牌字符串(详情见Figma访问令牌)。 projectId:将要使用的Figma文件URL以生成代码(详见Figma文件)。 获取 Figma 访问令牌 为了接收 Figma 文件,需要授权。通过转移个人访问令牌来实现此目的。可以通过几个简单的步骤创建该令牌: - 在 Figma 中打开账户设置页面。 - 转到“个人访问令牌”部分并点击“创建新的个人访问令牌”按钮。 - 输入描述信息(例如,“FigmaConvert”)。
  • 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文件作为清单。
  • 转换8位(256)PNG(适Windows
    优质
    一款专为Windows用户设计的命令行工具,能够高效地将图像转换为8位(256色)PNG格式,满足特定显示需求或文件压缩要求。 这是一款支持将任意格式的图片转换成8位PNG格式的工具,适用于需要减少图片体积的安卓游戏场合。该工具运行于Windows x86平台,并采用命令行界面操作。随附的readme.txt文件中详细介绍了使用方法。
  • 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” 插件还支持整个表格尺寸的一键调节功能。
  • getcomic-cli:readcomiconline.to下载漫画
    优质
    GetComic-CLI是一款专为读取readcomiconline.to网站内容设计的高效命令行工具,它支持用户轻松下载喜欢的漫画作品。 getcomic-cli 是一个从readcomiconline.to下载漫画的命令行工具。 特征: - 通过提供一期漫画的网址来下载该期漫画。 - 提供特定系列的网页链接,可以下载整个系列的所有内容。 - 支持用户输入指定范围的问题进行下载操作。 入门指南: 支持的操作系统:Ubuntu 先决条件: 1. Python3 2. pip3 安装步骤: 此工具需要无头浏览器来自动执行网页上的交互任务。这里使用的是Chrome浏览器。 首先,在您的计算机上安装最新版本的chrome浏览器,然后按照官方说明进行操作。 在Ubuntu 16.04 LTS中升级google-chrome,请运行以下命令:sudo apt-get --only-upgrade install google-chrome-stable 接下来需要下载并配置一个Chrome驱动程序。