블로그 커버 이미지 생성기 스킬
이 스킬은 AI 에이전트가 blog-cover-image-cli를 사용하여 멋지고 미니멀한 기술 블로그 커버 이미지를 생성할 수 있게 해줍니다. 이 CLI는 Gemini 3.1 Flash Image Preview를 활용하며, 도메인에서 브랜드 로고를 자동으로 가져오고, 로컬 미적 참조 이미지를 사용하며, Google Search 접지를 통해 실시간 컨텍스트를 주입합니다.
설정 및 구성
에이전트 사전 요구사항:
이 도구를 사용하기 전에 설치되어 있는지 확인하세요. blog-cover-cli --help 명령어가 실패하면 전역으로 설치하세요:
npm install -g blog-cover-image-cli
사용자가 이미지 생성을 요청했는데 아직 API 키를 설정하지 않았다면, 먼저 Gemini API 키를 사용하여 CLI를 구성해야 합니다. CLI는 conf 패키지를 통해 이 키를 안전하게 저장합니다.
# 1. Gemini API 키 설정 (이미지 생성에 필요)
npx -p blog-cover-image-cli blog-cover-cli config set-key <YOUR_GEMINI_API_KEY>
# 2. Brandfetch 클라이언트 ID 설정 (고해상도 로고를 가져오는 데 필요)
npx -p blog-cover-image-cli blog-cover-cli config set-brandfetch-id <YOUR_BRANDFETCH_CLIENT_ID>
# 키 확인 (마스킹됨)
npx -p blog-cover-image-cli blog-cover-cli config get-key
npx -p blog-cover-image-cli blog-cover-cli config get-brandfetch-id
사용법: 이미지 생성
사용자가 커버 이미지를 요청하면 (예: "Vercel v0에 대한 내 블로그 커버 이미지를 만들어 줘"), generate 명령어를 사용하세요.
npx -p blog-cover-image-cli blog-cover-cli generate -t "블로그 포스트 제목" -l "example.com"
인수
-t, --title <text>: (필수) 커버 이미지에 표시할 제목 텍스트입니다. 지나치게 긴 제목은 사용하지 마세요 (시각적으로 3줄 미만으로 유지).-l, --logo <domain>: (선택사항이지만 권장) 브랜드 로고를 가져올 도메인입니다 (예:vercel.com,google.com,cursor.com). CLI는 WebP/SVG/AVIF를 PNG로 자동 변환하여 호환성을 보장합니다.-o, --output <path>: (선택사항) 생성된 이미지가 저장될 파일 경로입니다. 생략하면 CLI는 현재 작업 폴더의output/디렉토리에 자동 저장합니다 (예:./output/vercel-cover.png).
예시
예시 1: Cursor
npx -p blog-cover-image-cli blog-cover-cli generate -t "Cursor가 최고의 AI 코드 편집기인 이유" -l "cursor.com"
예시 2: Lovable
npx -p blog-cover-image-cli blog-cover-cli generate -t "Lovable로 몇 분 만에 앱 구축하기" -l "lovable.dev"
예시 3: 사용자 지정 출력 경로
npx -p blog-cover-image-cli blog-cover-cli generate -t "2026년 React 마스터하기" -l "reactjs.org" -o "./assets/react-cover.png"
내부 작동 방식
에이전트로서 CLI가 무엇을 하는지 알아야 사용자에게 설명할 수 있습니다:
- 로고 가져오기: Brandfetch에서 로고를 가져와
sharp로 처리합니다. - 참조 이미지:
examples/디렉토리에서 큐레이팅된 참조 이미지를 로드하여 항상 깔끔하고 미니멀한 흰색 배경과 굵은 타이포그래피를 유지합니다. - 접지(Grounding):
googleSearch도구가 활성화되어 있어, 제목이 최근 사건과 관련된 경우 Gemini가 이미지 생성 전에 검색할 수 있습니다. - 텍스트 강제: 타이포그래피 배치 규칙을 사용하여 Gemini가 정확한 제목 문자열을 출력하도록 강제합니다.
예외 상황 및 문제 해결
- API 키 오류: API 키 오류가 발생하면
config set-key명령어를 실행하세요. - 로고 가져오기 경고: CLI가
Warning: Could not fetch logo라고 표시하면 로고 없이 이미지를 계속 생성합니다. 중단하거나 멈출 필요가 없습니다. - 엄격한 모달리티 제한: Gemini의 실험적 이미지 모델을 사용하기 때문에 엄격한 안전 필터로 인해 생성이 실패할 수 있습니다. 이런 경우 사용자에게 알리세요.