Taste Skill: 기업·제품 웹사이트 디자인 품질을 높이는 스킬
AI 코딩 에이전트가 기업·제품 웹사이트를 만들 때 디자인 시스템, 실제 사진·제품 UI, 반응형 배치와 브라우저 검사를 함께 적용하도록 하는 디자인 스킬이에요. 확인 버전은 2.5.0이며 현재 저장소에는 design-taste-frontend 한 개의 스킬이 있어요.
주요 기능
- 업종을 software·gaming·tech·product·service·place로 나누고 화면별 구성, 팔레트·글꼴·히어로 레이아웃을 정해요.
- HTML/CSS/JS 스타터, 제품 UI 조각, 사진·아이콘·다이어그램과 기술·게임용 효과 자산을 제공해요.
- consistency.mjs, 레이아웃 검사, 성능 검사와 스크린샷 스크립트로 여러 화면 폭에서 배치·대비·빈 시각 자료·링크·폼 등을 검사하도록 구성되어 있어요.
- 사진 출처를 기록하고 실제 브랜드 아이콘을 사용하며 모바일·동작 줄이기 설정의 대체 표현을 요구해요.
구조
skills/taste-skill/SKILL.md와 references/ 설계 지침, assets/ HTML·CSS·JS·사진, Node.js 보조 스크립트가 결합된 스킬 패키지예요. Codex 플러그인 매니페스트와 Claude 마켓플레이스 정의의 버전은 2.5.0예요. 독립적인 호스팅 서비스나 자동 품질 보증 제품은 아니에요.
누구에게 쓸모 있나요
AI로 기업 소개·SaaS·게임·제품·매장 웹사이트를 구현하거나 기존 랜딩 페이지를 개선하는 개발자와 디자이너.
설치 전 준비
- 스킬을 읽고 프로젝트 파일을 편집할 수 있는 코딩 에이전트가 필요해요.
- 보조 스크립트는 Node.js 22 이상과 설치된 Chrome·Edge·Chromium이 필요해요. 비표준 경로는 CHROME_PATH를 지정해요.
- ffmpeg는 사진 WebP 변환·모바일 크롭에 선택적으로 사용해요. 추가 사진·아이콘·Google Fonts 다운로드에는 네트워크가 필요해요.
- Claude Code·Codex 플러그인 및 Skills CLI 지원 에이전트.
- HTML/CSS 스타터를 직접 쓰거나 React·Next.js·Vue·Svelte·Astro·Tailwind 프로젝트에 설계 규칙과 검사를 이식하는 방식.
설치 방법
Skills CLI
공식 README 예시예요. 이번 조사에서 설치하거나 실행하지 않았어요.
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"Claude Code 플러그인
Claude Code 내부 명령이에요.
/plugin marketplace add Leonxlnx/taste-skill
/plugin install taste-skill@taste-skillCodex 플러그인
설치 후 새 Codex 세션을 시작하라고 안내해요.
codex plugin marketplace add Leonxlnx/taste-skill
codex plugin add taste-skill@taste-skill사용 방법
- 에이전트에게 업종, 이용자, 주요 행동과 실제 사진·제품 자료를 주고 사이트 제작 또는 개선을 요청해요.
- 에이전트는 자산을 프로젝트에 복사하고 스타터·설계 규칙에 따라 페이지를 구성한 뒤 제공된 브라우저 검사를 수행해요.
- 검사 결과와 확인하지 못한 항목, 가정한 정보, 대체 사진 및 실제 자료가 필요한 위치를 보고하도록 되어 있어요.
비용과 API 키
스킬은 MIT로 공개되어 있으며 자체 스크립트에는 API 키가 필요 없다고 안내해요. 코딩 에이전트·모델 사용료, 호스팅 및 외부 자산 이용 조건은 별도예요.
라이선스
루트 LICENSE는 MIT, Copyright (c) 2026 Leonxlnx예요. 사용·수정·재배포 시 저작권·허가 고지를 보존해야 하며 무보증 조건이 적용돼요. 사진·폰트·브랜드 아이콘 등 외부 자료의 권리는 별도로 확인해야 해요.
주의사항과 알려진 이슈
- 2.5.0의 엄격한 화면 높이·색상·이미지 설명·효과 사용 규칙은 모든 브랜드나 접근성·콘텐츠 요구에 맞는 보편 규칙이 아니에요. 기존 디자인 시스템과 충돌 여부를 검토해야 해요.
- 과거 high-end-visual-design·minimalist-ui 등은 taste-skill-classics, 이미지 관련 스킬은 imagegen-skills로 이동했어요. 예전 다중 스킬 소개를 현재 저장소 구성으로 오인하지 않아야 해요.
- install.sh 방식은 사용자 에이전트 폴더에 심볼릭 링크 또는 Windows junction을 만들며 이후 git pull 변경이 설치본에 바로 반영돼요. 업데이트 내용을 검토해야 해요.
- 브라우저 검사는 페이지 스크립트와 외부 자산을 로드해요. 신뢰할 수 없는 페이지나 실제 운영 폼·인증 세션이 아닌 통제된 환경에서 검증해야 해요.
- 문서의 ‘전문 사이트 수준’ 표현은 목표이며 검증된 성능·디자인 품질 보증이 아니에요. 사진을 실제 고객의 제품·직원·장소처럼 오인시키지 말고 이용 조건과 출처를 확인해야 해요.
확인 범위
확인 날짜: 2026-11-05
확인 커밋: 9b4bf937a1f69348126959c15d2f99a73e65699b
확인한 범위: 공식 GitHub API에서 canonical Leonxlnx/taste-skill, 공개·비보관 상태와 기본 main 브랜치를 확인했어요. 고정 커밋의 README·LICENSE·SKILL.md·플러그인 매니페스트·설치 스크립트 및 브라우저 검사 코드 일부를 정적으로 읽었습니다.
확인 한계: 대상 스킬 설치·프로그램 실행·빌드·브라우저 렌더링·성능 측정·전체 보안 감사를 수행하지 않았어요. 호스트별 실제 호환성과 이미지별 라이선스 준수는 별도 검증이 필요해요.