Omd Asset Fetch
사용자 product UI 생성 시 placeholder 자리를 generic SVG가 아닌 **실제 free-license CDN 자산**으로 채운다.
Install
npx skills add kwakseongjae/oh-my-design --skill omd-asset-fetch -g -a claude-code -y- Repository
- kwakseongjae/oh-my-design552
- Category
- Design
- Updated
- 3d ago
- License
- MIT
- Context cost
- Mediumabout 2,211 tokens
- Runs scripts
- No, instructions only
What it does
사용자 product UI 생성 시 placeholder 자리를 generic SVG가 아닌 **실제 free-license CDN 자산**으로 채운다. 로고·일러스트·아이콘·사진·폰트·패턴 카탈로그를 verified URL만으로 운영. '에셋 가져와줘', '플레이스홀더 진짜 이미지로', '로고 자리 채워줘', 'unsplash에서 사진 가져와' 류 요청에 트리거. omd:apply / omd:harness 안에서 자동 호출됨.
omd:asset-fetch, Free-license Asset Catalog
왜 이 스킬
"초안 같음" 결과물의 90%는 placeholder가 너무 generic이라서, [YOUR LOGO] 점선 박스, organic blob SVG, "image placeholder" 회색 사각형. 사용자가 "와우" 못 느낌.
이 스킬은 모든 placeholder 자리에 verified free-license CDN 자산을 박는 catalog. URL은 전부 200 OK 검증됨 (2026-05-14 기준).
핵심 원칙
- 검증된 URL만. 이 catalog에 없으면 generator가 임의로 만들지 말 것.
- 모든 자산은 commercial-use 허용, 사용자 product에 ship 가능.
- 출처는
assets/attribution.md에 의무 기록, URL + license + 사용 위치 + fetch 일자. - deterministic seeding 권장,
seed또는lock파라미터로 결과 재현 가능. 매번 다른 이미지 나오는 random URL은 피할 것. - 금지: handcraft inline SVG로 placeholder를 "그려서" 채우기. catalog 자산 fetch 실패 시 → brand-color CSS gradient placeholder (이전 v1.3.4 fallback 정책과 동일).
Catalog (verified 2026-05-14)
1. LOGO, product name 워드마크만 (v1.3.7부터)
별도 icon / shapes mark / DiceBear logo 합성 금지. 헤더 logo = product name 텍스트 + 디스플레이 폰트, 그게 전부.
왜: AI가 합성한 icon mark는 "generic"하게 보임 (사용자 frustration source). product 이름을 꽤 괜찮은 폰트로 그대로 박는 게 진짜 brand wordmark처럼 보이고 사용자가 1초만에 자기 product name으로 swap 가능.
패턴:
<a class="logo" href="/" style="display:inline-flex;align-items:center;text-decoration:none;">
<span class="logo-wordmark">{{PRODUCT_NAME}}</span>
</a>
<style>
.logo-wordmark{
font-family:"Bricolage Grotesque","Space Grotesk","DM Serif Display","Fraunces",-apple-system,sans-serif;
font-size:22px;font-weight:700;letter-spacing:-0.04em;
color:var(--color-text-heading);
}
</style>
<head>에 디스플레이 폰트 <link> 의무 (§6 참고).
brand vibe별 폰트 매칭:
- cool / minimal / fintech serious → Space Grotesk 700 (geometric)
- warm / playful / community → Bricolage Grotesque 700 (friendly variable)
- editorial / luxury → DM Serif Display 또는 Fraunces (display serif)
- bold / display → Bricolage Grotesque 800
