Claude를 비롯한 코딩 에이전트를 UX/UI 디자인 전문가로 만들어 주는 순수 지침·지식 키트로, DTCG 토큰, 컴포넌트 명세, 138개 디자인 시스템, 52개의 객관적 검증 항목을 제공합니다.
nextlevelbuilder/ui-ux-pro-max-skill
코딩 어시스턴트에 검색 가능한 UI/UX 디자인 규칙, 스타일, 팔레트, 폰트 조합과 기술 스택별 가이드를 제공하는 AI 에이전트 스킬입니다.
- 스타
- 138,031
- 포크
- 14,642
- 열린 이슈
- 91
- 마지막 커밋
- 6일 전
어떤 프로젝트인가요?
UI UX Pro Max는 사용자 인터페이스를 만들 때 AI 코딩 어시스턴트에 디자인 지식을 제공하는 스킬입니다. 검색 가능한 UI 스타일 카탈로그, 192개 제품 유형을 위한 색상 팔레트, 엄선한 폰트 조합, 차트 추천과 UX 가이드라인을 제공하며, Python 검색 스크립트가 BM25 순위 지정으로 관련 정보를 찾아 제품에 맞는 완전한 디자인 시스템을 생성합니다.
이 스킬은 npm 패키지 ui-ux-pro-max-cli를 통해 Claude Code, Cursor, Windsurf, GitHub Copilot, Codex CLI, Gemini CLI 등의 도구에 설치되며, 각 어시스턴트가 사용하는 디렉터리에 스킬 파일을 배치합니다. 기술 스택별 가이드에는 React, Next.js, Vue, Angular, Svelte 같은 웹 프레임워크와 SwiftUI, Jetpack Compose, Flutter 같은 모바일 옵션, 그리고 여러 데스크톱 프레임워크가 포함됩니다.
검색 스크립트는 Python 표준 라이브러리만 사용하며 네트워크 요청을 하지 않습니다. 디자인 시스템은 선택적으로 페이지별 재정의 항목을 포함해 MASTER.md 파일에 저장할 수 있으므로, 이후 세션에서도 같은 규칙을 다시 사용할 수 있습니다.
핵심 기능
- 01검색 가능한 UI 스타일 79종 카탈로그. 기본으로 50종이 활성화됩니다.
- 02192개 제품 유형을 위한 색상 팔레트와 엄선한 폰트 조합 74종.
- 03React, Vue, SwiftUI, Flutter를 비롯한 22개 프레임워크의 기술 스택별 가이드.
- 04Python CLI 스크립트로 제품 설명에서 디자인 시스템 생성.
- 05페이지별 재정의 항목을 지원하는 영구 디자인 시스템 파일.
- 06ui-ux-pro-max-cli npm 패키지를 통해 다양한 AI 코딩 어시스턴트에 설치.
활용 사례
- 랜딩 페이지나 대시보드를 만들기 전에 AI 코딩 어시스턴트에 디자인 규칙 제공.
- 새 SaaS, 핀테크 또는 헬스케어 제품을 위한 일관된 색상 및 타이포그래피 시스템 생성.
- 특정 프레임워크의 접근성 및 반응형 레이아웃 가이드라인에 따라 UI 코드 점검.
- MASTER.md 파일과 페이지별 재정의 항목으로 여러 세션에 걸쳐 하나의 디자인 시스템 유지.
빠른 시작
- 1
npm CLI 패키지 ui-ux-pro-max-cli를 찾아 README의 설치 안내를 따르세요
- 2
프로젝트가 Python으로 작성되었으므로 Python 3.x가 설치되어 있는지 확인하세요
사용 전 알아둘 점
- 사용 중인 머신에 Python 3.x가 필요합니다.
- 여기서 확인할 수 있는 README 발췌에는 전체 설치 명령이 나와 있지 않으므로, 사용 전에 설정 섹션을 확인하세요.
토픽
자주 묻는 질문
- ui-ux-pro-max-skill은(는) 무엇인가요?
- 코딩 어시스턴트에 검색 가능한 UI/UX 디자인 규칙, 스타일, 팔레트, 폰트 조합과 기술 스택별 가이드를 제공하는 AI 에이전트 스킬입니다. UI UX Pro Max는 사용자 인터페이스를 만들 때 AI 코딩 어시스턴트에 디자인 지식을 제공하는 스킬입니다. 검색 가능한 UI 스타일 카탈로그, 192개 제품 유형을 위한 색상 팔레트, 엄선한 폰트 조합, 차트 추천과 UX 가이드라인을 제공하며, Python 검색 스크립트가 BM25 순위 지정으로 관련 정보를 찾아 제품에 맞는 완전한 디자인 시스템을 생성합니다.
- ui-ux-pro-max-skill은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
- ui-ux-pro-max-skill은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
- ui-ux-pro-max-skill은(는) 아직 유지보수되고 있나요?
- 활발히 유지보수 중. ui-ux-pro-max-skill의 마지막 커밋은 2026년 10월 15일입니다.
- ui-ux-pro-max-skill은(는) 어디에 사용할 수 있나요?
- 랜딩 페이지나 대시보드를 만들기 전에 AI 코딩 어시스턴트에 디자인 규칙 제공. 새 SaaS, 핀테크 또는 헬스케어 제품을 위한 일관된 색상 및 타이포그래피 시스템 생성. 특정 프레임워크의 접근성 및 반응형 레이아웃 가이드라인에 따라 UI 코드 점검. MASTER.md 파일과 페이지별 재정의 항목으로 여러 세션에 걸쳐 하나의 디자인 시스템 유지.
- ui-ux-pro-max-skill는 어떻게 설치하나요?
- npm CLI 패키지 ui-ux-pro-max-cli를 찾아 README의 설치 안내를 따르세요 프로젝트가 Python으로 작성되었으므로 Python 3.x가 설치되어 있는지 확인하세요
- ui-ux-pro-max-skill은(는) 어디서 받을 수 있나요?
- 소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/nextlevelbuilder/ui-ux-pro-max-skill
요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.
관련 프로젝트
AI 코딩 어시스턴트에 Go 관용구, 테스트, 보안 및 인기 Go 라이브러리에 관한 실무 중심 지침을 제공하는 Go 전용 에이전트 스킬 모음입니다.
접근성과 성능 지침이 내장된 React, Next.js, Svelte, Astro용 Motion.dev 애니메이션을 생성하는 Claude Code 스킬
Radix UI와 Tailwind CSS 기반의 React 컴포넌트를 복사해 사용하고, 직접 소유하며 코드베이스에서 자유롭게 수정할 수 있습니다.
Claude Code, Claude.ai와 Codex, Cursor, Gemini CLI 같은 코딩 에이전트용 Claude Skills 및 플러그인 1,000여 개를 엄선해 모아 둔 디렉터리입니다.
다크 모드와 Next.js RSC를 지원해 웹 앱을 빠르게 만들 수 있는 접근성 중심의 React 컴포넌트 라이브러리이자 디자인 시스템입니다.