figma-to-codelisted

# Figma To Code ## Purpose Transfer designer-provided Figma layouts into production frontend code as accurately as possible while preserving architecture, design-system consistency, and runtime behavior. User-facing conversation stays in Russian unless requested otherwise. Repository documentation, code comments, commit messages, and design-token files stay in English. ## When To Use Use this skill without waiting for explicit invocation when the task is about: - Implementing, copying, transferring, or recreating a Figma frame, component, layout, selection, or designer mockup. - Matching a visual reference pixel-perfect or as close as possible in a browser. - Extracting Figma variables, styles, components, assets, dimensions, or Code Connect hints into code. - Turning design handoff material into React/frontend implementation. Do not use it for design-system-only refactors that have no Figma source; use `design-system-implementation` instead. ## Source Of Truth Figma MCP (`mcp__plugin_rldyour-mcps_figma__*`) is the source of truth for: - Selected frames, components, variants, variables, styles, layout data, dimensions, constraints, and assets. - Figma screenshots or visual references used for pixel comparison. - Code Connect hints when available; prefer connected project components over inventing new components. If Figma MCP is unavailable, say so and use only explicitly provided fallback assets such as screenshots or specs. Do not pretend a design was inspected.