# Frontend Reference Research

> Review external frontend references, screenshots, UI libraries, Figma Community examples, and design cases, then distill reusable patterns without copying third-party pages or unclear assets.

- Skill: `yuukias/frontend-reference-research` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add yuukias/frontend-reference-research`
- Raw SKILL.md: https://api.skillmd.com/api/skills/yuukias/frontend-reference-research/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Design & Media
- Author: YuukiAS (https://skillmd.com/u/yuukias)
- Updated: 2026-09-21
- Page: https://skillmd.com/skills/yuukias/frontend-reference-research

---

# Frontend Reference Research

Use this skill before visual design when the user provides or requests outside UI references, including Notion intake pages, screenshots, design case studies, component libraries, icon sets, and public galleries.

## Boundary

- Record source, access date, license/permission when known, and the reusable pattern.
- Keep private screenshots and Notion pages in local intake unless the user explicitly approves public reuse.
- Do not commit full third-party pages, watermarked assets, unclear brand images, or private screenshots.
- Treat private Notion images and binary attachments as evidence only. If a connector returns text but not downloadable binary URLs, record the unresolved asset instead of inventing content.
- Hand the distilled brief to `frontend-visual-systems` or `research-product-frontend`.

## Output

Produce a concise reference note with:

- source and date;
- what is reusable;
- what must not be copied;
- target project fit;
- implementation constraints for the downstream frontend builder.

## Reference Notes

- `references/2026-ai-frontend-resources.md`: 2026 Notion intake and public verification notes for AI-assisted frontend taste, reference galleries, motion components, and icon libraries.