问题标签 [figma]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
869 浏览

android - 如何在颤动中设置盒子阴影

我有一个 figma 设计,我需要像这样设置盒子阴影。

投影

0 投票
1 回答
78 浏览

figma - 如何检查构建的网页是否与 Figma Design 匹配?

给出了 Figma 设计,并要求按照该设计构建页面。

如何确保页面设计符合 Figma?

或者换句话说,如果页面上显示的任何内容与 Figma 设计不匹配,如何通过突出显示或错误(示例设计不匹配等)来查看页面和 Figma 设计的差异?

0 投票
0 回答
23 浏览

visual-studio-code - Visual Studio Code 插件创建指南

15 年前,我在高中上过 C++ 课。这就是我的编程知识范围。截图附在下面。

我正在使用 Visual Studio Code 尝试为名为 Figma 的基于 Web 的设计工具创建一个插件(我是一名 UX 设计师)。我已经使用默认的通用插件示例启动并运行了程序,它运行得很好,所以我知道我已经把所有东西都安排好了。

但是我正在尝试创建的插件允许用户在按住 Figma 中的按钮(例如 Shift 键)的同时仅垂直或水平地以 0 或 90 度在 Figma 中导航。我知道这应该取决于用户是否在 Figma 中选择了特定工具,所以我知道需要一个 if/then 或 if/else 语句。我只是完全不知道从哪里开始,或者我什至应该尝试学习什么语言来做到这一点。有人至少可以将我指向正确的方向作为起点吗?谢谢!

截图在这里

0 投票
1 回答
135 浏览

css - 如何将 CSS 样式转换为 React-Native

我正在使用 figma 进行屏幕设计。figma 中的所有样式都是 CSS 格式。但是我正在使用 React-Native 开发应用程序,其中所有样式都与 CSS 不同。

让我们说 CSS 中的框阴影

react-native 中的这种样式将是这样的,

(这两种样式不是精确的转换。两者都是不同的。我只是举个例子)

是否有任何标准方法可以将 CSS 样式转换为 React-native?谢谢你。

0 投票
0 回答
143 浏览

tailwind-css - 从 Tailwind UI Figma 文件导出以创建 Tailwind CSS 主题

我正在试验 Tailwind UI,我想弄清楚的一件事是是否有任何记录的方法可以从 Tailwind UI 创建导出,它们可用于创建可在tailwind.config.js文件中使用的主题。

我玩过 Style Dictionary 和 Figma Design Token 插件,它们可能有效,但感觉它们需要付出惊人的努力。在这个领域是否有任何经过验证的解决方案?

0 投票
1 回答
99 浏览

html - 文本在垂直方向上没有完全居中,因为字体的后代稍大

当我在网上试用Calibre字体时,我注意到文本在垂直方向上没有正确居中。经过研究,我发现字体的后代比上升字体略厚。

下图是 Figma 中的 calibre 字体,清楚地表明后代更大 在此处输入图像描述

因为它在 figma 上,所以很容易纠正。但是当我在网上尝试时,我遇到了同样的问题。文本在垂直方向上未正确居中。 在此处输入图像描述

在此处输入图像描述

我在这里附上了代码。

经过一番谷歌搜索,我发现实际上有一个名为descent-override的属性可以在@font-face中使用,它解决了这个问题。但是,MDN 提到 Safari 和其他旧版本浏览器不支持该属性。

使用descent-override 在此处输入图像描述后 ,图像中很难注意到差异,但在实时网络上却非常显着。

是否有任何适当的方法可以在不影响浏览器兼容性的情况下垂直居中此文本?谢谢。

0 投票
0 回答
62 浏览

figma - 使用 Figma API 引用组件到库

我在 figma 中有 2 个设计库,我的页面被引用到第一个库。我想构建一个插件来将我的组件引用到第二个库。在 node 的 figma API 中,虽然我可以在 UI 中看到,但我没有找到组件引用。在此处输入图像描述

我如何使用 figma API 修改它。

0 投票
0 回答
733 浏览

animation - 如何将 Figma 中的动画导出为 Lottie 格式?

我想做加载器,设计师用 Figma 的 Json 发给我,但我想把它转换成 Lottie 可用的 json 动画。

也许你知道一些方法如何用我自己或设计师的帮助来做这件事?

太感谢了!

0 投票
1 回答
249 浏览

javascript - 将 figma 文件转换为图像格式

我想让用户上传 figma 文件并将这些 figma 文件显示为 React 应用程序中的图像。

用例:用户可以将他/她的设计上传为 figma 文件并显示为图像

我可以做这个任务吗?

0 投票
0 回答
16 浏览

reactjs - 是否可以从反应代码生成 figma 插件?

这是一个奇怪的场景。但是假设您有一个样式化的组件 React 组件库,以及它的故事书(或没有)。你想用这些组件生成一个 figma 插件供设计师使用。

有这样的工具吗?