Trung Quốchallee9000/heron-handoff
A Figma handoff tool, support offline exporting.
🎨 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
Dự án tương tự
Khám phá các dự án và mô hình AI khác có sự tương đồng.
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.
coolicons is a carefully designed collection of 440+ icons with a focus on simplicity and consistency. Perfectly suited for web, application and mobile design.
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.
:signal_strength::iphone::car: Wireless Network Handoff Visualizer built with React!
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.
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.
Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.
MCP server to provide Figma layout information to AI coding agents like Cursor