현지화된 읽기 가이드
frontend-design목적, 사용법 및 출처
독창적이고 뛰어난 디자인 품질을 갖춘 고품질 프런트엔드 인터페이스를 제작하세요. 사용자가 웹 컴포넌트, 페이지, 결과물, 포스터 또는 애플리케이션(예: 웹사이트, 랜딩 페이지, 대시보드, React 컴포넌트)을 제작하도록 요청할 때 이 스킬을 활용하세요.HTML/CSS레이아웃, 또는styling/beautifying모든 웹 UI에 적용 가능합니다. 일반적인 AI 미학을 피하고 창의적이고 세련된 코드와 UI 디자인을 생성합니다.
출처 검색됨:
- 소스 저장소
- vercel-labs/open-agents
- SKILL.md
.agents/skills/frontend-design/SKILL.md- 저장소 Star
- 5,871
- 저장소 최근 업데이트
- 2026-08-29
- 능력 분류
- 설계
- 최근 수집 시간
라이선스: MIT
워크플로 발췌본은 이해를 돕기 위한 자료이며, Codez에서 제공하는 실행 가능한 명령어가 아닙니다. 이 페이지를 생성하는 데 타사 Skill은 사용되지 않았습니다.
아래의 목적 및 워크플로 관련 내용은 읽기 쉽도록 정리 및 번역된 상위 자료입니다. 이는 별도로 분류된 Codez 편집 분석과는 별개입니다.
이 스킬의 기능
독창적이고 뛰어난 디자인 품질을 갖춘 고품질 프런트엔드 인터페이스를 제작하세요. 사용자가 웹 컴포넌트, 페이지, 결과물, 포스터 또는 애플리케이션(예: 웹사이트, 랜딩 페이지, 대시보드, React 컴포넌트)을 제작하도록 요청할 때 이 스킬을 활용하세요.HTML/CSS레이아웃, 또는styling/beautifying모든 웹 UI에 적용 가능합니다. 일반적인 AI 미학을 피하고 창의적이고 세련된 코드와 UI 디자인을 생성합니다.
업스트림 워크플로우 작동 방식
개요
이 스킬은 일반적인 "AI 기반" 디자인에서 흔히 볼 수 있는 투박한 미적 감각을 피하고, 차별화되고 실제 운영 환경에 적합한 프런트엔드 인터페이스를 제작하는 데 도움을 줍니다. 미적 디테일과 창의적인 선택에 세심한 주의를 기울여 실제 작동하는 코드를 구현해야 합니다. 사용자는 구축할 컴포넌트, 페이지, 애플리케이션 또는 인터페이스와 같은 프런트엔드 요구사항을 제공해야 합니다. 요구사항에는 목적, 대상 고객 또는 기술적 제약 조건에 대한 맥락 정보가 포함될 수 있습니다.
상류 통로 · L6 ↗프런트엔드 디자인 가이드라인
타이포그래피: 아름답고 독특하며 흥미로운 글꼴을 선택하세요. Arial이나 Inter 같은 일반적인 글꼴은 피하고, 프런트엔드의 미적 감각을 높여주는 개성 있는 글꼴을 선택하세요. 예상치 못한 독특한 글꼴을 활용하는 것도 좋은 방법입니다. 개성 있는 디스플레이 글꼴과 세련된 본문 글꼴을 함께 사용하는 것도 효과적입니다. 색상 및 테마: 통일된 디자인을 유지하세요. CSS 변수를 활용하여 일관성을 확보하는 것이 좋습니다. 은은하고 고르게 분포된 색상 팔레트보다는 강렬한 악센트가 있는 주된 색상이 더 효과적입니다.
상류 통로 · L26 ↗요구 사항 및 설정
이 파일에서 간략한 요구사항 구절이 선택되지 않았습니다. 이는 해당 스킬에 종속성이 없다는 의미는 아닙니다. 저장소 설정 지침 및 참조 파일을 확인하십시오.
제한 사항 및 품질 검사
이 파일에서 별도의 제한 조건 구문이 선택되지 않았습니다. 이는 해당 스킬이 모든 입력 또는 환경에서 안전하다는 것을 의미하지 않습니다. 전체 소스 코드를 검토하고 결과를 직접 확인하십시오.
안전한 시험 사용부터 시작하세요
- 지원되는 호스트와 저장소 설치 지침을 확인하세요. 스킬 디렉토리와 해당 디렉토리에서 참조하는 스크립트, 자산 및 문서를 함께 보관하세요.SKILL.md단독으로는 종속성을 생략할 수 있습니다.
- 에이전트에 실제 입력값, 원하는 출력값 및 승인 기준을 제공하십시오. 호출 구문 및 사용 가능한 도구는 호스트에 따라 다르므로 이 사이트는 범용 설치 명령을 제공하지 않습니다.
- 원본 워크플로를 임시 프로젝트 또는 복사본에서 테스트해 보세요. 파일, 원격 서비스 또는 유료 리소스를 변경하는 작업은 허용하기 전에 검토하십시오.
- 출력 결과를 원본 품질 검사 및 자체 요구 사항에 맞춰 검증하십시오. 트리거가 성공적으로 작동했거나 저장소의 별점 수가 높다고 해서 반드시 올바른 결과가 나오는 것은 아닙니다.
원문에서 더 자세한 내용을 읽어보세요.
관련 기술
번역 및 범위
이 독서 안내서는 고정된 상류 지역에서 발췌한 구절들을 소개합니다.SKILL.md본 번역은 보조 번역이며, 완전한 설명서 또는 호환성 테스트를 보장하는 것은 아닙니다. 사용 전에 원본 및 참조 파일을 반드시 읽어 주십시오.
이 소개글은 아래 고정된 버전을 참조하며, 현재 저장소 활동 및 수집 시간은 별도로 표시됩니다.
- 고정된 소스
- 원문을 읽어보세요 ↗
- 출처 검색됨
- 소스 커밋
cf865e94de7729751c747171785b6ce57e7b178c- 출처 SHA-256
1bb3263d490c2585bf64a4e399ab28650a5034d7705abdbbe82a5a9dce1e6873