Repolode
제출하기
madebymustafa

madebymustafa/design-taste

Claude Code, Codex, Cursor, opencode가 더 개성 있고 의도적으로 설계된 UI를 만들도록 유도하는 오픈소스 에이전트 스킬 24종 모음입니다.

GitHub에서 보기
스타
217
포크
13
열린 이슈
0
마지막 커밋
3개월 전

어떤 프로젝트인가요?

AI 코딩 에이전트는 남색 그라데이션, 중앙 정렬 히어로 섹션, 기능 카드 세 개, 기본 글꼴처럼 비슷한 인터페이스를 만드는 경향이 있습니다. design-taste는 각 에이전트의 skills 디렉터리에 넣는 일반 텍스트 지침 파일인 에이전트 스킬 모음으로, 이런 기본값에서 벗어난 결과물을 만들도록 유도합니다. 핵심 스킬은 브리프 읽기, 디자인 방향 선택, 흔한 LLM 패턴 금지, 사전 점검 체크리스트 실행을 다룹니다.

핵심 스킬에 더해 스위스 편집 디자인의 미니멀리즘, 브루탈리즘 산업 디자인, 조용한 럭셔리, 다크 테크, 레트로 인쇄물, 일본 와비사비 미니멀리즘 등 뚜렷한 시각적 정체성을 정의하는 장르 팩 열 가지가 포함됩니다. 각 팩에는 같은 브리프를 바탕으로 만든 HTML 전후 비교 데모가 제공됩니다. 타이포그래피, 색상, 모션, GSAP, 접근성, UX 카피, 성능, 코드 리뷰를 다루는 craft 스킬은 어떤 장르 팩과도 함께 사용할 수 있습니다.

스킬 폴더를 복사하거나 포함된 설치 스크립트를 실행해 설치할 수 있습니다. 설치 스크립트는 Claude Code, Cursor, Codex, opencode, Cline, Roo를 대상으로 합니다.

핵심 기능

  • 01브리프를 읽고 디자인 방향을 선언하며 LLM의 기본 패턴을 피하도록 돕는 핵심 스킬
  • 02뚜렷한 시각적 정체성을 지닌 장르 팩 열 가지와 각 팩의 전후 비교 데모
  • 03타이포그래피, 색상, 모션, 접근성, UX 카피, 성능을 위한 craft 스킬
  • 04토큰 기반 CSS, 시맨틱 HTML, 심각도순 코드 리뷰를 위한 코드 스킬
  • 05Claude Code, Cursor, Codex, opencode, Cline, Roo를 대상으로 하는 설치 스크립트

활용 사례

  • 템플릿처럼 보이지 않는 랜딩 페이지나 마케팅 사이트를 AI 코딩 에이전트로 생성
  • AI로 구축하는 프런트엔드 프로젝트 전반에 일관된 시각적 방향 적용
  • 에이전트가 생성한 UI에서 흔한 패턴과 접근성 문제 검토
  • 3단계 구조를 문서화한 디자인 토큰 시스템 구축

빠른 시작

  1. 1

    리포지토리를 클론합니다

    git clone https://github.com/madebymustafa/design-taste.git
  2. 2

    프로젝트 폴더로 이동합니다

    cd design-taste
  3. 3

    모든 스킬을 에이전트에 설치합니다

    ./scripts/install.sh

사용 전 알아둘 점

  • Genre packs는 개성이 뚜렷한 비주얼 아이덴티티이므로 프로젝트마다 하나씩 선택해야 합니다.

포함된 컬렉션

Claude Code·Codex 스킬 팩AI 코딩 에이전트용 UI 디자인 스킬Claude Code 도구·스킬·플러그인오픈소스 AI 에이전트 프레임워크와 앱AI 코딩 어시스턴트와 에이전트AI 에이전트 스킬 라이브러리프론트엔드 프레임워크 & UI 컴포넌트

토픽

#agent-skills#ai-agents#claude-code#design-systems#ui-design#css#prompt-engineering#frontend#codex#cursor

자주 묻는 질문

design-taste은(는) 무엇인가요?
Claude Code, Codex, Cursor, opencode가 더 개성 있고 의도적으로 설계된 UI를 만들도록 유도하는 오픈소스 에이전트 스킬 24종 모음입니다. AI 코딩 에이전트는 남색 그라데이션, 중앙 정렬 히어로 섹션, 기능 카드 세 개, 기본 글꼴처럼 비슷한 인터페이스를 만드는 경향이 있습니다. design-taste는 각 에이전트의 skills 디렉터리에 넣는 일반 텍스트 지침 파일인 에이전트 스킬 모음으로, 이런 기본값에서 벗어난 결과물을 만들도록 유도합니다. 핵심 스킬은 브리프 읽기, 디자인 방향 선택, 흔한 LLM 패턴 금지, 사전 점검 체크리스트 실행을 다룹니다.
design-taste은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
design-taste은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
design-taste은(는) 아직 유지보수되고 있나요?
6개월 이내 업데이트. design-taste의 마지막 커밋은 2026년 8월 15일입니다.
design-taste은(는) 어디에 사용할 수 있나요?
템플릿처럼 보이지 않는 랜딩 페이지나 마케팅 사이트를 AI 코딩 에이전트로 생성 AI로 구축하는 프런트엔드 프로젝트 전반에 일관된 시각적 방향 적용 에이전트가 생성한 UI에서 흔한 패턴과 접근성 문제 검토 3단계 구조를 문서화한 디자인 토큰 시스템 구축
design-taste는 어떻게 설치하나요?
리포지토리를 클론합니다: git clone https://github.com/madebymustafa/design-taste.git 프로젝트 폴더로 이동합니다: cd design-taste 모든 스킬을 에이전트에 설치합니다: ./scripts/install.sh
design-taste은(는) 어디서 받을 수 있나요?
소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/madebymustafa/design-taste

요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.

관련 프로젝트