RepositoryJavaScriptCNChina
hallee9000

hallee9000/heron-handoff

A Figma handoff tool, support offline exporting.

351stars
29forks
22issues
0views

🎨 Heron Handoff: Công cụ xuất specs từ Figma, hỗ trợ offline

Một plugin Figma giúp xuất file handoff kèm design specs chi tiết, hỗ trợ làm việc ngoại tuyến.

Heron Handoff là một công cụ hỗ trợ xuất file handoff từ Figma với các thông số thiết kế chi tiết. Dự án này là mẫu template để sinh file handoff. Người dùng cần cài đặt Heron Handoff Plugin trước khi sử dụng.

✨ Điểm nổi bật

  • Cài đặt plugin: Cài đặt Heron Handoff Plugin từ Figma Community.
  • Chạy plugin: Mở file Figma, nhấn phải chuột chọn plugin -> Heron Handoff.
  • Chọn khung và xuất: Plugin tự động nhận diện các khung cấp cao nhất, cho phép chọn xuất.
  • Chọn ảnh xuất: Nhận diện các layer có thuộc tính export, hỗ trợ đặt lại tên ảnh trùng lặp.
  • Xem design specs: Xuất file zip chứa index.html để xem specs.
  • Hỗ trợ module React: Cài đặt qua NPM để phát triển tích hợp.

💡 Vì sao đáng chú ý

Khác với các công cụ xuất thông thường, Heron Handoff tích hợp toàn bộ quy trình từ thiết kế Figma đến file specs hoàn chỉnh. Plugin tự động nhận diện khung và layer export, đồng thời hỗ trợ xuất ngoại tuyến. Dễ dàng chuyển đổi thành module React để tích hợp vào dự án, phù hợp cho workflow phát triển frontend hiệu quả.


#Figma #Handoff #OpenSource #React #TiniX

Similar Projects

Discover other similar projects and AI models.

RepositoryJavaScript
grab/cursor-talk-to-figma-mcp

TalkToFigma: MCP integration between AI Agent (Cursor, Claude Code, Codex) and Figma, allowing Agentic AI to communicate with Figma for reading designs and modifying them programmatically.

7.1k
Jul 26, 2026
RepositoryJavaScript
krystonschwarze/coolicons

coolicons is a carefully designed collection of 440+ icons with a focus on simplicity and consistency. Perfectly suited for web, application and mobile design.

484
Oct 29, 2026
RepositoryJavaScript
Adityaraj0421/naksha-studio

A virtual design team for Claude Code, Cursor, Windsurf, Gemini CLI, and Copilot — 30 roles, 70 commands, 16,000+ lines of expert design knowledge. Your agency's design brain, inside your terminal.

348
Oct 18, 2026
RepositoryJavaScript
didoo/figma-api

Figma REST API implementation with TypeScript, Promises & ES6

267
Oct 20, 2026
RepositoryJavaScript
chonyy/handoff-visualizer

:signal_strength::iphone::car: Wireless Network Handoff Visualizer built with React!

150
Mar 3, 2023
Repository
VoltAgent/awesome-design-md

A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.

124.4k
Oct 28, 2026
RepositoryTypeScript
onlook-dev/onlook

The Developer Tool for Visual Engineers • An Open-Source AI-First Design tool • Visually build, style, and edit your code with AI • World's best, top-most agent recommended #1 Developer tool for Designers and Visual Engineers to design with Real Code.

27.0k
Oct 21, 2026
RepositoryTypeScript
lucide-icons/lucide

Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.

25.3k
Oct 26, 2026
RepositoryTypeScript
GLips/Figma-Context-MCP

MCP server to provide Figma layout information to AI coding agents like Cursor

16.1k
Oct 27, 2026