클로드 코드 디자인 스킬 5대장 추천

클로드 코드 디자인 스킬 5대장 추천
1. frontend-design
역할: 통일성 있는 디자인 시스템 구축 및 정갈한 UI 컴포넌트 설계
개념: 뻔한 AI 스타일 UI를 피하고, 반응형·접근성·컴포넌트 구조가 고려된 완성도 높은 코드를 출력하도록 지침을 제공합니다.
사용법: 프로젝트 설정 파일(CLAUDE.md 또는 System Prompt)에 지침으로 등록하거나, UI 코드 생성 요청 시 스킬을 명시하여 프롬프트로 호출합니다.
실전 예시:
frontend-design 규칙 적용해서 독서 기록 앱의 대시보드 메인 화면 만들어줘. 테마는 깔끔한 모노톤에 포인트 컬러 1개만 쓰고, 모바일 우선 반응형 레이아웃으로 짜줘. WCAG AA 기준을 만족하는 색상 대비와 aria-label을 포함해서 Next.js와 Tailwind CSS 기반 컴포넌트로 작성해줘.

출처 · Threads/@native_jeong