废话少说，直接上图。分别是使用图片复刻和使用skill复刻后的效果对比。 
 [image] 
[image] 
[image] 
[image] 
原理介绍，传统的图片风格提取往往会有遗漏，归根到底模型训练的时候是直接用css代码训练的，图片在转译的过程中必然有信息损耗。 
这个skill旨在通过chrome-devtools-mcp工具直接获取对应网页的dom信息，能够精确到像素级别复刻，生成一个详细的风格指南。 
使用方法，强绑定chrome-devtools-mcp，请自行学习一下这个mcp的使用方法。skill就自行复制到cc和codex的skill目录下吧。 
本人对于codex和claude code进行了测试，codex更加细致，能够提取一些动态效果，cc比较懒但是审美比较好，适合静态网站。 

和ui-ux-pro-skill相比，这个skill的个性化程度更高，更适合有...