Traduzca las propiedades y estructuras de diseño de Figma en implementaciones de componentes IDS (Iress Design System). Esta habilidad ayuda a los agentes de IA a interpretar los metadatos de diseño de Figma (de herramientas como Figma MCP o especificaciones de diseño exportadas) y producir código IDS preciso.
Instala rápidamente el skill de IA figma-to-ids en tu entorno de desarrollo mediante línea de comandos
Fuente: iress/design-system.
Translate Figma design properties and structures into IDS (Iress Design System) component implementations. This skill helps AI agents interpret Figma design metadata (from tools like Figma MCP or exported design specs) and produce accurate IDS code.
| Auto-layout (vertical) | IressStack | Default direction is vertical | | Auto-layout (horizontal) | IressInline | Horizontal flow with wrapping | | Auto-layout gap | gap prop | Map px to spacing token (see below) | | Auto-layout padding | p, px, py props | Map px to spacing token |
| Auto-layout alignment | horizontalAlign / verticalAlign | Maps to start, center, end | | Grid layout | IressRow + IressCol | Use span prop for column widths |
Traduzca las propiedades y estructuras de diseño de Figma en implementaciones de componentes IDS (Iress Design System). Esta habilidad ayuda a los agentes de IA a interpretar los metadatos de diseño de Figma (de herramientas como Figma MCP o especificaciones de diseño exportadas) y producir código IDS preciso. Fuente: iress/design-system.
Campos y comandos estables para citas de IA/búsqueda.
npx skills add https://github.com/iress/design-system --skill figma-to-idsTraduzca las propiedades y estructuras de diseño de Figma en implementaciones de componentes IDS (Iress Design System). Esta habilidad ayuda a los agentes de IA a interpretar los metadatos de diseño de Figma (de herramientas como Figma MCP o especificaciones de diseño exportadas) y producir código IDS preciso. Fuente: iress/design-system.
Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/iress/design-system --skill figma-to-ids Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw
https://github.com/iress/design-system