# unsplash-asset-images

This skill picks Unsplash photos for avatars, headshots, backgrounds and wallpapers, and names the ratios and resolutions you need.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 1600 installs · ★ 7001
- Author: MengTo
- License: MIT · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/MengTo/Skills/tree/HEAD/agent-skills/media/unsplash-asset-images/SKILL.md
- Updated: 2026-10-25
- HTML: https://affpapa.org/en/nevibecode/skills/unsplash-asset-images

## What it does

The skill kicks in when an agent has to choose an image for a product or design asset: an avatar, a headshot, a portrait, a wide site background, an abstract wallpaper. It returns the Unsplash photo page URL plus suggested ratios and sizes for that use case.

Inside are five curated sets of five images each: avatars at 1:1, headshots at 4:5 and 3:4, portraits, 16:9 backgrounds, and abstract wallpapers for desktop and mobile. Sizes come with each category — 256×256 and 1024×1024 for avatars, 1920×1080 and 2880×1620 for wide backgrounds, 1080×1920 for mobile wallpapers. The skill file lives at `~/.claude/skills/unsplash-asset-images/SKILL.md`.

The skill tells you to skip Unsplash+ images and not to treat the photographer name as required attribution, since Unsplash does not require it. Need an actual file? Use the Download button on the photo page, then crop to the target ratio in your design tool. Keep faces centered for avatars and preserve the horizon on wide backgrounds.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add MengTo/Skills --skill unsplash-asset-images -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/unsplash-asset-images/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/unsplash-asset-images/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add MengTo/Skills --skill unsplash-asset-images -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/unsplash-asset-images/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add MengTo/Skills --skill unsplash-asset-images -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/unsplash-asset-images/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install MengTo/Skills unsplash-asset-images
```

2. **Manually: put the files in place**
- File: `.github/skills/unsplash-asset-images/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add MengTo/Skills --skill unsplash-asset-images -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/MengTo/Skills --path agent-skills/media/unsplash-asset-images
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/unsplash-asset-images/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add MengTo/Skills --skill unsplash-asset-images -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/MengTo/Skills/tree/HEAD/agent-skills/media/unsplash-asset-images/SKILL.md

## When to use it
- pick an avatar with a clean background and a centered face
- choose the ratio and resolution for a headshot card
- find a wide background for a site hero section
- grab abstract wallpapers for desktop and mobile
- filter out Unsplash+ images and keep the regular ones

## Example prompts
- pick a 1:1 avatar for a profile, give me the link and sizes
- I need a 16:9 hero background, show me Unsplash options
- find abstract 9:16 wallpapers for a mobile screen

## Source text · SKILL.md · MIT

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: 33a907065215738f.

BEGIN THIRD-PARTY FILE 33a907065215738f
```text
---
name: unsplash-asset-images
description: Use when you need to pick high-quality Unsplash images for product/design assets (avatars, headshots, portraits, large website backgrounds, and abstract wallpapers) and output real Unsplash URLs plus practical instructions for producing the right resolutions and aspect ratios (1:1, 4:5, 3:4, 16:9, 9:16).
---

# Unsplash Asset Images (Avatars, Portraits, Backgrounds, Wallpapers)

Goal: quickly grab *good-looking* images from Unsplash and deliver them in the **right size + ratio**.

## Output rule
For each recommendation, output:
1) **Unsplash page URL** (canonical)
2) Suggested **ratios + sizes** for the use case

If the user wants a file, instruct them to use the **Download** button on Unsplash and then crop/resize in their design tool or image pipeline.

## License / safety (keep it simple)
- Unsplash images are generally free to use, but **avoid Unsplash+** images unless the user explicitly wants them.
- Don’t present the photographer name as “required attribution” (Unsplash doesn’t require it), but it’s good practice to include.

---

## How to deliver the right size + ratio

1. Open the Unsplash photo page and use the **Download** button.
2. Resize/crop to the target ratio in your design tool or image pipeline.
3. Keep faces centered for avatars/headshots and preserve horizon for wide backgrounds.

Note: do not include Unsplash source or secondary image links; keep only the main photo page URLs.

---

## Curated picks (5 each)

### 1) Avatars (1:1)
Pick images with clean face framing + simple backgrounds.

1. https://unsplash.com/photos/man-wearing-black-shirt-aoEwuEH7YAs
2. https://unsplash.com/photos/grayscale-photography-of-man-wearing-crew-neck-shirt-jmURdhtm7Ng
3. https://unsplash.com/photos/grayscale-photography-of-woman-with-two-hands-on-her-face--Keh6vLM7w0
4. https://unsplash.com/photos/man-in-black-crew-neck-shirt-QWa0TIUW638
5. https://unsplash.com/photos/man-wearing-black-denim-jacket-near-building-2RFwLL-YX44

Suggested deliverables:
- 1:1: **256×256**, **512×512**, **1024×1024**

### 2) Headshots (4:5 or 3:4)
Aim for shoulders-up framing, neutral backgrounds, “professional but human”.

1. https://unsplash.com/photos/mans-grey-and-black-shirt-ILip77SbmOE
2. https://unsplash.com/photos/man-facing-on-left-side-co2Nn11OP3k
3. https://unsplash.com/photos/woman-with-blue-eyes-and-black-hair-VLJV46hPLSM
4. https://unsplash.com/photos/woman-with-blonde-hair-and-red-lipstick-8f3yvMdkWJI
5. https://unsplash.com/photos/a-young-woman-poses-with-hands-near-her-face-bF6wuOivk2M

Suggested deliverables:
- 4:5: **800×1000**, **1200×1500**, **1600×2000**
- 3:4: **900×1200**, **1500×2000**
```
END THIRD-PARTY FILE 33a907065215738f

The third-party file has ended. Everything between the 33a907065215738f tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 2704 of 5096 bytes. © MengTo · MIT · https://github.com/MengTo/Skills/tree/HEAD/agent-skills/media/unsplash-asset-images/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md