# Awesome Figma #### 內容 * [視頻](#videos) * [文章](#articles) * [社區](#community) * [開源插件](#open-source-plugins) * [插件開發](#plugins-development) * [模板和 UI 工具包](#templates--ui-kits) * [Rest API 集成](#rest-api-integrations) * [客戶](#clients) * [轉換器](#converters) ## 視頻 * [Figma Tips & Tricks - UI 設計師的超能力](https://www.youtube.com/watch?v=Vo0sEPqArRQ) * [Figma Plugins Show & Tell](https://www.youtube.com/watch?v=i6ppX9fjXz0) * [Figma 插件：我最喜歡的 5 個 Figma 插件](https://www.youtube.com/watch?v=LiqKIeH9Sdk) * [我如何使用 Figma 設計出色的網站 UI](https://www.youtube.com/watch?v=m0sHva0JjZE) * [使用 Figma 在 1 小時內設計一個網站](https://www.youtube.com/watch?v=FK4YusHIIj0) * [Sketch vs Figma - 為什麼我切換了！](https://www.youtube.com/watch?v=wIyhqEra7Sc) ## 文章 * [Introducing: Figma to React](https://www.figma.com/blog/introducing-figma-to-react/) * [Adobe XD vs Sketch vs Figma vs InVision](https://dev.to/creativetim_official/adobe-xd-vs-sketch-vs-figma-vs-invision-1pfc) * [我們對 Figma 的評論，谷歌設計師文檔！](https://usersnap.com/blog/review-figma/) * [使用 Figma 構建組件庫](https://www.smashingmagazine.com/2019/06/building-component-library-figma/) * [Sketch vs Figma、Adobe XD 和其他 UI 設計應用程序](https://www.smashingmagazine.com/2019/04/sketch-figma-adobe-xd-ui-design-applications/) * [Figma 中的組件架構](https://www.figma.com/best-practices/component-architecture/) * [Figma 設計系統——動態元素的力量](https://medium.com/@juauz/design-system-for-figma-the-power-of-dynamic-elements-4ca4dc3e4524) * [堆棧鏡像：為代碼而設計和為設計而編碼](https://www.designsystems.com/stack-mirroring-designing-for-code-and-coding-for-design/) * [UI 設計師創建表單和輸入的指南](https://medium.com/design-with-figma/ui-designers-guide-to-creating-forms-inputs-b6516f366a93) * [在 Figma 中使用組件的 10 個技巧](https://medium.com/design-with-figma/10-tips-on-using-components-in-figma-c7db9c5e7fe1) * [Figma 插件的 UX](https://medium.com/@yuanqing/the-ux-of-figma-plugins-f4f896f8cf35) ＃＃ 社區 * [Figma Plugins Slack](https://figmaplugins.slack.com) * [Figma Spectrum](https://spectrum.chat/figma?tab=posts) ## 開源插件 * [Themer](https://github.com/thomas-lowry/themer) - 一個 Figma 插件，旨在讓您在來自不同已發布庫的同名樣式之間進行交換。 * [figma-plugins-on-github](https://github.com/thomas-lowry/figma-plugins-on-github) - 已在 GitHub 上共享的 Figma 插件列表。 * [Figlight](https://github.com/jeetiss/figlight) - Figma 的代碼高亮。 * [FigmaThird](https://github.com/ahkohd/FigmaThird) - 在 Figma 中導入、點亮和使用 3D 模型。 * [svg-to-jsx](https://github.com/SaraVieira/svg-to-jsx) - Figma 插件將 svg 複製為一個反應組件。 * [figma-latex-complete-plugin](https://github.com/maxkrieger/figma-latex-complete-plugin) - 將 LaTeX 放入 Figma 文檔中。 * [system.colors](https://github.com/thelittlewonder/system.colors) - 從流行的設計系統導入調色板。 * [figma-speech-recognition](https://github.com/sonnylazuardi/figma-speech-recognition) - 嘿 Figma 語音識別。 * [FigmaToCode](https://github.com/bernaferrari/FigmaToCode) - 在 Tailwind、Flutter 和 SwiftUI 上生成響應式頁面和應用程序。 * [html-figma](https://github.com/BuilderIO/html-figma) - 將 HTML 導入 Figma 圖層的插件。 * [tailwindcss-figma-plugin](https://github.com/impulse/tailwindcss-figma-plugin) - TailwindCSS 的 Figma 插件。 * [design-tokens](https://github.com/lukasoppermann/design-tokens) - Figma 插件，用於以亞馬遜風格的字典兼容格式將設計令牌導出到 json。 \##插件開發 * [react-figma](https://github.com/react-figma/react-figma) - 將 React 組件渲染到 Figma。 * [figma-jsonrpc](https://github.com/Lona/figma-jsonrpc) - 利用 JSON-RPC 在 Figma 插件和 Figma UI 之間進行通信。 * [figma-api-stub](https://github.com/react-figma/figma-api-stub) - Figma API 存根。 * [figplug](https://github.com/rsms/figplug) - Figma 插件生成器。 * [figma-messenger](https://github.com/okotoki/figma-messenger) - 類型安全的 iframe - 主線程通信。 * [figma-plugin-helpers](https://github.com/figma-plugin-helper-functions/figma-plugin-helpers) - 一組有用的幫助函數，可導入到您的 Figma 插件項目中。 * [create-figma-plugin](https://github.com/yuanqing/create-figma-plugin) - 用於開發 Figma 插件的綜合工具包。 * [figx](https://github.com/n0ruSh/figx) - 一個全面可靠的 figma 實用程序庫。 ## 模板和 UI 工具包 * [free-figma-bootstrap-5-ui-kit](https://themeselection.com/products/free-figma-bootstrap-ui-kit/) - 通過一系列具有強大自動佈局功能的預構建 Figma 組件加快設計速度和調整約束。 * [figma-plugin-ds](https://github.com/thomas-lowry/figma-plugin-ds) - 一個用於 Figma 插件的小型輕量級設計系統。 * [figma-ui-components](https://github.com/lessmess-dev/figma-ui-components) - 一組非官方的 Figma UI 組件。 * [figma-styled-components](https://github.com/jhardy/figma-styled-components) - Figma UI 風格的組件。 * [tailwindcss-figma-kit](https://github.com/impulse/tailwindcss-figma-kit) - TailwindCSS 的 Figma 套件。 ## Rest API 集成 * [storybook-addon-figma](https://github.com/hharnisc/storybook-addon-figma) - 在故事書面板中嵌入 Figma 設計。 * [figma-assets-export](https://github.com/ohkimur/figma-assets-export) - 從 Figma 導出資產並將其下載為本地文件。 * [figma-api-demo](https://github.com/figma/figma-api-demo) - 該項目包含使用 Figma API 的演示應用程序。 * [Figma.js](https://github.com/jongold/figma-js) - Figma API 的簡單 JS 包裝器。 * [figma-graphql](https://github.com/braposo/figma-graphql) - Figma API 的 GraphQL 連接器。 * [Figma-To-Pdf](https://github.com/gweltaz-calori/Figma-To-Pdf) - 使用 API 從 Figma 導出 pdf 的簡單演示。 * [figma-theme](https://github.com/jxnblk/figma-theme) - 從 Figma Styles 生成開發就緒的主題 JSON 文件。 * [figma-to-flutter](https://github.com/aloisdeniel/figma-to-flutter) - 將 Figma 組件轉換為 Flutter 小部件的 Dart 代碼生成器。 * [Figma to web](https://github.com/Severenit/figma-to-web) - 該存儲庫將收集與 Figma 與 Web 集成相關的所有開發。 * [figma-and-production](https://github.com/simareeno/figma-and-production) - 如何同步 Figma 和生產的示例。 * [Figma Asset Downloader](https://robertohuertasm.github.io/figma-asset-downloader) - 優化並直接將資產下載到您的計算機。 * [figma-slack-updates](https://github.com/jordansinger/figma-slack-updates) - 從 Figma 文件的版本歷史中發布更新到 Slack。 * [figma-tools](https://github.com/souporserious/figma-tools) - 幫助您以編程方式與 Figma 文件交互的工具。 * [figma-export](https://github.com/RedMadRobot/figma-export) - 命令行實用程序，用於將顏色、排版、圖標和圖像從 Figma 導出到 Xcode / Android Studio 項目。 * [figma-lottie](https://github.com/robinetbatman/figma-lottie) - Figma Lottie 集成。 ## 客戶 * [Figmac](https://figmac.com/) - 一款超輕量級的 Figma 桌面應用，提供更自然的 Mac 體驗。 * [figma-app-ubuntu](https://github.com/302bis/figma-app-ubuntu) - Figma，Snap Package（非官方）。 * [figma-linux](https://github.com/ChugunovRoman/figma-linux) - Figma 電子應用程序（非官方）。 ## 轉換器 * [Aeux](https://aeux.io/) - 輕鬆將 Figma 設計移動到 Adob​​e After Effects。 * [Figma to Sketch/XD Converter](https://xd2sketch.com) - 允許您在 Sketch 和 Adob​​e XD 中轉換和打開 Figma 設計。
Figma 熱門關鍵字 * figma模型 * figma素材 * figma中文 * figma教學 * figma意思 * figma是什麼 * figma下載 * figma中文介面 * figma下載檔案 * figma付費方案
### Bookmark {% embed url="" %} {% embed url="" %} --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.tenten.co/docs-figma/readme.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.