Claude 디자인 카드 (claude-design-card)

무엇을 해주나

• 아무 텍스트나 웹페이지 URL을 넣으면 내용을 요약·정제한 뒤, Claude/Anthropic 감성(파치먼트 배경 #f5f4ed, 테라코타 강조 #c96442, Georgia 세리프 제목)의 완전 자립형 HTML 카드를 생성합니다.
• 플랫폼 커버(위챗 헤더 900×383, 비리비리/유튜브 1280×720, 세로 1080×1440, 숏폼 1080×1920), 이미지+텍스트 콘텐츠 카드, 정사각 인용/수치 카드, 장문 편집 레이아웃(Broadsheet·Feature·Reader·Digest) 등 총 14종 포맷을 표 기반으로 골라줍니다.
• 바로 만들지 않고 주 추천 1개 + 대안 2개를 제시하고 플랫폼·목적을 최대 3개 질문으로 확인합니다.
• SVG는 장식이 아니라 기능(장식 룰선, 대형 인용부호, 편집 일러스트, 데이터 시각화, 패턴 바탕)으로 5분류하고 개수·투명도·색상 한계를 강제합니다.
• 마지막에 bun scripts/screenshot.ts로 Playwright 스크린샷을 찍어 PNG를 저장하며, QR 코드 삽입과 자동 높이(--full-page) 모드도 지원합니다.

이런 분께 추천

• 뉴스레터·블로그·SNS용 표지 이미지와 카드뉴스를 자주 만드는 콘텐츠 마케터, 1인 크리에이터
• 디자이너 없이도 톤이 일관된 이미지를 뽑고 싶은 기획자·개발자
• 긴 글이나 논문(arXiv)을 요약 카드로 재가공해 공유하려는 리서처

활용 예시

1. "이 아티클 URL로 유튜브 썸네일 만들어줘" → r.jina.ai로 본문 수집 → 1280×720 가로 커버 추천 → HTML 미리보기 → "스크린샷"이라고 답하면 PNG 생성.
2. 강의 노트를 붙여넣고 "단계 교재 카드" 요청 → Practical Toolkit 모드의 1080×1440 3:4 카드 2~4단계 블록으로 생성.
3. 리포트 수치를 넣고 "데이터 강조 정사각 카드" 요청 → 초대형 숫자 + stroke-dasharray 애니메이션 折線/막대 SVG가 들어간 1080×1080 카드 + 하단 QR 코드 삽입.

이 파일의 지시를 읽고 그대로 따라서 나를 도와줘:
https://raw.githubusercontent.com/geekjourneyx/claude-design-card/HEAD/SKILL.md

내가 원하는 것: (여기에 하고 싶은 일을 쓰세요)

클로드스킬마트에서 찾은 스킬을 설치해줘.
GitHub 저장소 geekjourneyx/claude-design-card 의 SKILL.m 폴더를 내 ~/.claude/skills/claude-design-card/ 에 그대로 복사해줘.
설치가 끝나면 이 스킬로 무엇을 할 수 있는지 한 줄로 알려줘.