home/categories/frontend/smallnest-langgraphgo-testdata-skills-ui-analyzer-skill-md
frontenddevelopment

ui-analyzer

Analyze UI design screenshots and generate React components with TypeScript and Tailwind CSS. Use this skill when the user provides UI mockups, design screenshots, or Figma exports and requests implementation. Provides detailed layout analysis, component breakdown, design token extraction, and production-ready code generation following best practices.

smallnest
maintainer
smallnest
更新于 12/3/2025
星标
228
分支
35
quick start

Installation and usage

Analyze UI design screenshots and generate React components with TypeScript and Tailwind CSS. Use this skill when the user provides UI mockups, design screenshots, or Figma exports and requests implementation. Provides detailed layout analysis, component breakdown, design token extraction, and production-ready code generation following best practices.

安装
$ install --globalskills.sh
使用

安装后,您可以通过在终端运行以下命令来使用此技能:

skills use ui-analyzer