code-connect-components

ทักษะนี้ควรใช้เมื่อผู้ใช้ขอให้วิเคราะห์การบันทึกหน้าจอ UI และแมปสถานะการโต้ตอบลงใน Figma เรียกใช้สำหรับคำขอเช่น "put video…

สร้างและดูแลไฟล์เทมเพลต Figma Code Connect ที่แมปส่วนประกอบของ Figma กับโค้ดสั้นๆ ใช้เมื่อผู้ใช้พูดถึง Code Connect, ส่วนประกอบของ Figma…

กฎระบบการออกแบบที่กำหนดเองสำหรับการนำ Figma ไปใช้เป็นโค้ดอย่างสม่ำเสมอทั่วทั้งโปรเจกต์ของคุณ สร้างข้อกำหนดเฉพาะของโปรเจกต์สำหรับการจัดระเบียบคอมโพเนนต์ การจัดรูปแบบสไตล์ โทเค็นการออกแบบ และการจัดการแอสเซ็ตที่ช่วยแนะนำเอเจนต์ AI ในการสร้างโค้ดที่สอดคล้องกัน รองรับรูปแบบไฟล์กฎสามแบบ: CLAUDE.md สำหรับ Claude Code, AGENTS.md สำหรับ Codex CLI และ .cursor/rules/figma-design-system.mdc สำหรับ Cursor ต้องมีการเชื่อมต่อเซิร์ฟเวอร์ Figma MCP และการวิเคราะห์โค้ดเบสเพื่อค้นหารูปแบบที่มีอยู่ก่อนสร้างกฎ...

แปลการเคลื่อนไหวและแอนิเมชันจาก Figma เป็นโค้ดแอปพลิเคชันที่พร้อมใช้งานจริง ใช้เมื่อต้องการนำแอนิเมชัน/การเคลื่อนไหวจากดีไซน์ Figma ไปใช้งาน — ผู้ใช้กล่าวถึง…

การแปล SwiftUI ↔ Figma ใช้เมื่อผู้ใช้กล่าวถึง Swift, SwiftUI, iOS, iPhone หรือ iPad — ไม่ว่าทิศทางใด — แปลการออกแบบ Figma เป็น…

Motion / animation context for the `use_figma` MCP tool — animating Figma nodes via manual keyframes, animation styles, easing, and timeline duration. Load…

ทักษะนี้ช่วยให้เอเจนต์ใช้เครื่องมือ MCP use_figma ของ Figma ในบริบทของสไลด์ สามารถใช้ร่วมกับ figma-use ซึ่งมีบริบทพื้นฐานสำหรับการใช้…

ทักษะนี้ช่วยให้เอเจนต์ใช้เครื่องมือ MCP use_figma ของ Figma ในบริบทของ FigJam สามารถใช้ควบคู่กับ figma-use ซึ่งมีบริบทพื้นฐานสำหรับการใช้…