pulkitxm/claude-directory

解决的问题

提供一个经过精心挑选的开源画廊，展示使用 Claude（特别是 Fable 5）生成的高保真度 Web UI 实验和前端组件。它为开发者和设计师提供了一个参考，展示 AI 在现代 Web 界面、动画和 3D 场景方面的构建能力。

如何工作

该仓库包含一系列自包含的项目文件夹。每个项目都包含生成的代码（使用 React、TypeScript、Vite、Tailwind CSS、Three.js 和 GSAP 等技术栈）以及创建该项目所用的具体提示（prompt.md）。这使得用户可以复制粘贴组件，或研究实现特定视觉效果所使用的提示技巧。

适用人群

• 寻找 AI 生成 UI 灵感或可直接复制的模板的 前端开发者。
• 对如何使用 LLM 生成复杂网页设计和布局提示感兴趣的 提示工程师。
• 探索 Claude 在“氛围编码”和快速原型设计方面能力的 AI 爱好者。

亮点

• 多样化类别：包含英雄区域、着陆页、GLSL 着色器、设计系统、3D/WebGL 场景和动画。
• 提示透明性：每个项目都附带原始提示，使生成过程可复现。
• 现代技术栈：采用 Framer Motion、Three.js 和 Tailwind CSS 等行业标准工具。
• 实时目录：托管的画廊允许用户在深入代码前先视觉浏览这些实验。