A friend asked me if there are good methods for generating code from Figma. His current approach is to export HTML code from Figma and then have GitHub Copilot rewrite the exported code according to the component format in the codebase. He finds it cumbersome to copy and paste the code and write a bunch of prompts for Copilot to rewrite. I'm not very familiar with Figma, so I suggested he could try taking a screenshot of the Figma results or exporting it as a PNG, and then sending the screenshot to Copilot, allowing Copilot to generate the UI code directly based on the screenshot. He said that the styles obtained this way are not as accurate as those exported from Figma, since Figma has precise colors and dimensions, while AI-generated ones are not as precise. I suggested he consider combining both methods: exporting the code and generating screenshots simultaneously, and then sending the screenshots, the Figma exported code, and component descriptions to AI (using XML tags to separate the prompts). This way, he can balance UI generation and style accuracy. Reference prompts are as follows: [UI Design Screenshot] <Figma Exported Code> [Figma Code……] </Figma Exported Code> <UI Component Description> [React UI Component Description……] </UI Component Description> Above are the UI design images and the corresponding Figma code. Please refer to the UI component description and use the UI components I provided to regenerate the UI code.