Setup
On first use, read setup.md silently. No setup needed for basic use.
When to Use
User needs stock photos or placeholder images for mockups, prototypes, websites, or presentations. Agent provides direct URLs without API keys when possible.
Architecture
No persistent storage needed. Reference files loaded on demand.
Quick Reference
| Topic | File |
|---|
| Setup | INLINECODE1 |
| Memory template |
memory-template.md |
| All providers with examples |
providers.md |
| Unsplash category URLs |
unsplash-categories.md |
Core Rules
1. Prefer Direct URL Services
For quick mockups and prototypes, use services that work without API keys:
- - Lorem Picsum — random photos by size
- Placehold.co — colored placeholders with text
- PlaceKeanu — Keanu Reeves placeholder photos
- Unsplash Source — direct links to Unsplash photos
2. Match Content to Context
| Need | Best Source |
|---|
| Generic photo placeholders | Lorem Picsum, Unsplash Source |
| Specific subjects (business, nature) |
Unsplash, Pexels, Pixabay |
| Colored boxes with dimensions | Placehold.co |
| Avatars/faces | UI Faces, This Person Does Not Exist |
| Icons | Iconify, Feather Icons |
3. Know the URL Patterns
Quick patterns that work immediately:
CODEBLOCK0
4. Use Cached URLs for Consistency
When building prototypes that need consistent images across sessions:
- - Use
id parameter in Lorem Picsum - Save specific Unsplash photo URLs
- Use
?random=1 only when variety is needed
5. Respect Licensing
| Service | License | Attribution |
|---|
| Unsplash | Unsplash License | Not required but appreciated |
| Pexels |
Pexels License | Not required |
| Pixabay | Pixabay License | Not required |
| Lorem Picsum | Various | Photos from Unsplash |
For commercial projects, verify license on original photo page.
6. Load Category Index for Specific Needs
When user needs specific subjects (business people, landscapes, food), load
unsplash-categories.md for curated URLs by category.
7. Optimize for Performance
- - Use WebP format when supported: INLINECODE8
- Use exact dimensions needed (no oversized images)
- For retina: Placehold.co supports
@2x and INLINECODE10
Common Traps
- - Using random URLs in production without caching → inconsistent images
- Hotlinking without checking terms → service blocks requests
- Using placeholder services for final production → unprofessional
- Requesting too large images → slow load times
External Endpoints
| Endpoint | Data Sent | Purpose |
|---|
| picsum.photos | Image dimensions | Random photo |
| placehold.co |
Dimensions, colors, text | Placeholder image |
| source.unsplash.com | Search terms | Unsplash photos |
| placekeanu.com | Dimensions | Keanu placeholder |
No authentication required. No user data sent.
Security & Privacy
Data that leaves your machine:
- - HTTP requests with dimensions and optional search terms
Data that stays local:
- - Cached images in browser
- No tracking, no API keys needed
This skill does NOT:
- - Store credentials
- Track usage
- Require API registration
Related Skills
Install with
clawhub install <slug> if user confirms:
- -
image — image analysis and manipulation - INLINECODE13 — AI image generation
- INLINECODE14 — frontend development
- INLINECODE15 — design principles
- INLINECODE16 — UI design patterns
Feedback
- - If useful: INLINECODE17
- Stay updated: INLINECODE18
设置
首次使用时,请静默阅读 setup.md。基本使用无需设置。
使用时机
用户需要用于模型、原型、网站或演示的库存照片或占位图片。代理应尽可能提供无需API密钥的直接URL。
架构
无需持久化存储。按需加载参考文件。
快速参考
memory-template.md |
| 所有提供商及示例 | providers.md |
| Unsplash分类URL | unsplash-categories.md |
核心规则
1. 优先使用直接URL服务
对于快速模型和原型,使用无需API密钥的服务:
- - Lorem Picsum — 按尺寸随机图片
- Placehold.co — 带文本的彩色占位图
- PlaceKeanu — 基努·里维斯占位图片
- Unsplash Source — Unsplash图片的直接链接
2. 内容与场景匹配
| 需求 | 最佳来源 |
|---|
| 通用图片占位符 | Lorem Picsum、Unsplash Source |
| 特定主题(商务、自然) |
Unsplash、Pexels、Pixabay |
| 带尺寸的彩色方块 | Placehold.co |
| 头像/人脸 | UI Faces、This Person Does Not Exist |
| 图标 | Iconify、Feather Icons |
3. 掌握URL模式
可立即使用的快速模式:
Lorem Picsum - 按尺寸随机图片
https://picsum.photos/800/600
Lorem Picsum - 按ID指定图片
https://picsum.photos/id/237/800/600
Lorem Picsum - 灰度
https://picsum.photos/800/600?grayscale
Placehold.co - 带文本的灰色占位图
https://placehold.co/800x600
Placehold.co - 自定义颜色
https://placehold.co/800x600/000/fff
Unsplash Source - 特定搜索
https://source.unsplash.com/800x600/?nature
PlaceKeanu - 带尺寸
https://placekeanu.com/800/600
4. 使用缓存URL保持一致性
构建需要跨会话保持图片一致性的原型时:
- - 在Lorem Picsum中使用id参数
- 保存特定的Unsplash图片URL
- 仅在需要多样性时使用?random=1
5. 遵守许可协议
| 服务 | 许可协议 | 署名要求 |
|---|
| Unsplash | Unsplash许可 | 非必需但建议 |
| Pexels |
Pexels许可 | 无需署名 |
| Pixabay | Pixabay许可 | 无需署名 |
| Lorem Picsum | 多种许可 | 图片来自Unsplash |
商业项目请在原图页面核实许可协议。
6. 按需加载分类索引
当用户需要特定主题(商务人士、风景、美食)时,加载unsplash-categories.md获取按分类整理的URL。
7. 优化性能
- - 支持时使用WebP格式:https://picsum.photos/800/600.webp
- 使用精确所需尺寸(避免超大图片)
- 视网膜屏:Placehold.co支持@2x和@3x
常见陷阱
- - 在生产环境中使用随机URL而不缓存 → 图片不一致
- 未检查条款直接热链接 → 服务屏蔽请求
- 在最终生产中使用占位服务 → 不专业
- 请求过大图片 → 加载缓慢
外部端点
| 端点 | 发送数据 | 用途 |
|---|
| picsum.photos | 图片尺寸 | 随机图片 |
| placehold.co |
尺寸、颜色、文本 | 占位图片 |
| source.unsplash.com | 搜索词 | Unsplash图片 |
| placekeanu.com | 尺寸 | 基努占位图 |
无需认证。不发送用户数据。
安全与隐私
离开您设备的数据:
保留在本地的数据:
此技能不会:
相关技能
如果用户确认,使用clawhub install
安装:
- - image — 图片分析与处理
- image-generation — AI图片生成
- frontend — 前端开发
- design — 设计原则
- ui — UI设计模式
反馈
- - 如果觉得有用:clawhub star stock-images
- 保持更新:clawhub sync