elayadesign/ai-design-skills

어떤 프로젝트인가요?

핵심 기능

• 01구조, 카피, 비주얼 시스템을 다루는 landing-page-design 스킬 제공
• 02각 스킬은 독립적으로 설치할 수 있는 별도 폴더로 구성
• 03Claude Code, Cursor, Codex, Windsurf, Cline 및 일반 시스템 프롬프트에서 사용 가능
• 04글꼴, 색상, 간격 등의 디자인 토큰을 편집 가능한 한 섹션에 모아 둠
• 05MIT 라이선스로 공개

활용 사례

• AI 코딩 어시스턴트로 제품 출시용 랜딩 페이지 생성
• AI 도구에 일관된 디자인 규칙을 제공해 생성되는 UI가 정의된 비주얼 시스템을 따르게 함
• 저장소를 fork해 팀 브랜드에 맞게 글꼴, 색상, 간격을 사용자 지정

빠른 시작

1. 1

   프로젝트에 skills 폴더를 만듭니다

   mkdir -p .claude/skills
2. 2

   리포지토리를 임시 폴더에 클론합니다

   git clone https://github.com/elayadesign/ai-design-skills.git /tmp/ai-design-skills
3. 3

   원하는 skill 폴더를 프로젝트에 복사합니다(<skill-name>을 바꾸세요. 예: landing-page-design)

   cp -r /tmp/ai-design-skills/skills/<skill-name> .claude/skills/
4. 4

   Claude Code에서 해당 skill이 다루는 내용을 자연어로 물어봅니다

포함된 컬렉션

토픽

자주 묻는 질문

ai-design-skills은(는) 무엇인가요?

Claude Code, Cursor, Codex 같은 AI 코딩 도구를 위한 독립형 디자인 스킬 파일 모음으로, 랜딩 페이지 스킬부터 시작합니다. AI Design Skills는 AI 코딩 도구가 사용자 인터페이스를 만들 때 따를 수 있는 Markdown 기반 디자인 스킬 모음입니다. 각 스킬은 SKILL.md 파일을 포함한 독립형 폴더로 구성되어 있어, 필요한 스킬만 프로젝트의 rules 또는 skills 디렉터리에 설치하면 됩니다.

ai-design-skills은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

ai-design-skills은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

ai-design-skills은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. ai-design-skills의 마지막 커밋은 2026년 11월 1일입니다.

ai-design-skills은(는) 어디에 사용할 수 있나요?

AI 코딩 어시스턴트로 제품 출시용 랜딩 페이지 생성 AI 도구에 일관된 디자인 규칙을 제공해 생성되는 UI가 정의된 비주얼 시스템을 따르게 함 저장소를 fork해 팀 브랜드에 맞게 글꼴, 색상, 간격을 사용자 지정

ai-design-skills는 어떻게 설치하나요?

프로젝트에 skills 폴더를 만듭니다: mkdir -p .claude/skills 리포지토리를 임시 폴더에 클론합니다: git clone https://github.com/elayadesign/ai-design-skills.git /tmp/ai-design-skills 원하는 skill 폴더를 프로젝트에 복사합니다(<skill-name>을 바꾸세요. 예: landing-page-design): cp -r /tmp/ai-design-skills/skills/<skill-name> .claude/skills/ Claude Code에서 해당 skill이 다루는 내용을 자연어로 물어봅니다

ai-design-skills은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/elayadesign/ai-design-skills