在使用 AI 工具生成前端 UI 时，我们经常会遇到炫彩的背景、灰色的图片占位符或不尽满意的图标，导致界面设计感割裂。
今天，我给大家分享一个提升 UI 生成效果的小工具——Lorem Picsum。
Lorem Picsum
Lorem Picsum 是一个免费、简单易用的占位图片服务，专为开发者和设计师在开发网页或应用时提供高质量的随机图片。
- 完全免费：无需注册、无需 API Key，直接通过 URL 调用即可。
- 使用极其简单：
src="https://picsum.photos/800/600"，即可获取一张 800×600 的随机图片。 - 接口灵活：支持指定图片、黑白图片、模糊效果、强制刷新、裁剪等操作。
- 图片质量高：真实摄影师作品。
- 响应速度快：全球 CDN 加速，加载迅速。
图片来源 Unsplash，所以，遵循 Unsplash 许可，请尽可能明确给出摄影师署名
AI 中使用
下面我们就看看如何使用 Lorem Picsum 提升 UI 生成质量。
为了更好地展示效果，我们通过两次请求进行对比。
- 场景：生成个人网站首页。
- 开发环境：TRAE 国际版 IDE 模式 + Claude-4-Sonnet。
为了更好的突出图片的效果，提示词中有意突出了“大banner的概念”。
未使用 Lorem Picsum
指令
帮我生成一个个人网站首页，采用大banner图美化
效果
使用 Lorem Picsum
指令
帮我生成一个个人网站首页，采用大banner图美化，图片采用picsum.photos URL。
效果
代码
下面就是 Banner 部分使用图片的代码，一个 URL 即可搞定。
结语
说实话，用 Lorem Picsum 给原型塞图，真的既省心又提升质感，一个 URL 就全部搞定。
尽管，随机生成的图片可能无法完美解决我们全部的需求，但“进一步有进一步的效果”。
接下来，我打算尝试把 Unsplash API 和 AI 集成起来，让图片渲染更加精准。
如果你也对这方面感兴趣，欢迎关注讨论！
