98.8K+다운로드
사용 가이드로 건너뛰기
brand작성자 nextlevelbuilder

Brand 스킬.

Claude Code 및 Codex용 브랜드 및 디자인 시스템 스킬: 브랜드 보이스, 시각 아이덴티티, 메시징 프레임워크, 브랜드 일관성을 다룹니다.

  • Brand & Design Systems
OpenDesign 다운로드사용 가이드 보기
nextlevelbuilder/ui-ux-pro-max-skill · .claude/skills/brand/SKILL.mdSKILL.md
--- name: brand description: Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides. --- ## When to Use ## Script Paths ## Quick Start ## Brand Sync Workflow ## Subcommands ## Scripts
2026-09-14 업스트림 파일에서 읽은 서문 및 섹션 제목 · 전체 3,512자

01 기능

Claude Code와 Codex에서 브랜드 스킬이 하는 일

요약, 워크플로, 산출물을 모두 해당 스킬의 SKILL.md에서 그대로 읽어 정리한 내용입니다.

SKILL.md에서2026-09-14 읽음 · 실행 기록 아님

스킬 자체의 표현으로

이 스킬은 브랜드 아이덴티티, 톤앤보이스, 메시징 프레임워크, 비주얼 아이덴티티 표준 및 에셋 일관성을 관리합니다. docs/brand-guidelines.md에 단일 진실 공급원(Single Source of Truth)을 유지하고 이를 design-tokens.json 및 design-tokens.css에 동기화합니다. 이 스킬은 프롬프트에 브랜드 컨텍스트를 주입하고, 에셋 명명 규칙과 형식을 검증하고, 색상을 추출해 팔레트와 비교하고, 브랜드 일관성을 점검하는 스크립트를 제공합니다.

톤앤보이스, 비주얼 아이덴티티, 메시징, 색상 관리, 타이포그래피, 로고 사용, 승인 워크플로에 대한 참고 프레임워크가 포함되어 있습니다. 사용자는 브랜드 아이덴티티를 업데이트하고 모든 디자인 시스템에 그 변경 사항을 전파할 수 있으며, 에셋과 콘텐츠가 브랜드 규정을 준수하는지 검토할 수 있습니다.

산출물

  • assets/design-tokens.css에 있는 CSS 변수 파일
예시 프롬프트 보기 ↗

작동 방식

  1. 01
    브랜드 가이드라인 소스 편집

    모든 브랜드 정의의 단일 소스로 사용되는 docs/brand-guidelines.md를 수정합니다.

  2. 02
    디자인 토큰에 동기화

    sync-brand-to-tokens.cjs를 실행하여 가이드라인의 변경 사항을 assets/design-tokens.json과 assets/design-tokens.css에 전파합니다.

  3. 03
    프롬프트에 컨텍스트 주입

    inject-brand-context.cjs를 사용하여 브랜드 컨텍스트를 추출하고, 필요한 경우 JSON 형태로 에이전트 프롬프트에 삽입합니다.

  4. 04
    자산 검증

    자산 경로를 지정하여 validate-asset.cjs를 실행하면 명명 규칙, 크기, 형식 준수 여부를 확인합니다.

  5. 05
    색상 추출 및 비교

    extract-colors.cjs를 사용하여 이미지에서 색상을 추출하거나 팔레트를 표시한 후, 브랜드 기준과 비교합니다.

02 적합성 확인

brand 스킬을 사용해야 하는 경우

이러한 종류의 브랜드 및 디자인 시스템 작업의 경우 Claude Code 또는 Codex에서 brand 스킬을 사용하십시오. 아래의 적합성 및 제한 사항은 스킬 자체 파일에서 가져온 것입니다.

적합한 경우

  • 콘텐츠 제작을 위한 브랜드 목소리 정의 및 문서화
  • 시각적 아이덴티티 기준 및 스타일 가이드 개발
  • 일관된 커뮤니케이션을 위한 메시징 프레임워크 작성
  • 브랜드 일관성을 위한 콘텐츠 및 자산 점검
  • 브랜드 자산 정리, 명명, 승인

    03 스킬 내부

    brand 스킬이 Claude Code와 Codex에 부여하는 규칙

    SKILL.md가 에이전트에 설정하는 5가지 구체적 지침, 기본값, 한계 — 결과를 바꾸는 파일의 부분입니다.

    1. 스크립트 경로는 스킬 디렉터리를 기준으로 합니다

      이 스킬과 참조 문서의 스크립트 경로는 프로젝트 루트가 아니라 SKILL.md가 포함된 디렉터리를 기준으로 합니다.

    2. 동기화는 JSON과 CSS 토큰 모두에 전파됩니다

      sync-brand-to-tokens.cjs 스크립트는 assets/design-tokens.json과 assets/design-tokens.css 양쪽에 씁니다.

    3. 자산은 명명, 크기, 형식 기준으로 검증됩니다

      validate-asset.cjs 스크립트는 자산 명명 규칙, 파일 크기, 형식 준수 여부를 확인합니다.

    4. update 하위 명령은 모든 디자인 시스템에 동기화합니다

      update 하위 명령은 브랜드 아이덴티티를 업데이트하고 모든 디자인 시스템에 걸쳐 변경 사항을 동기화합니다.

    5. 하위 명령은 ARGUMENTS에서 라우팅됩니다

      $ARGUMENTS의 첫 번째 단어에서 하위 명령을 파싱하고, 해당하는 references/{subcommand}.md를 로드한 후 나머지 인자로 실행합니다.

    04 활용하기

    Claude Code 또는 Codex에 brand 설치

    npx skills add 명령 한 번 실행 후, 에이전트에서 첫 번째 작업을 수행하고 결과 체크리스트를 확인합니다.

    Claude Code, Codex 또는 귀하의 에이전트에 brand 추가

    프로젝트에서 실행합니다. 설치 프로그램이 어떤 에이전트에 추가할지 묻습니다.

    Terminal
    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill brand

    .claude/skills/brand/SKILL.md에 대한 일반적인 skills CLI 형식입니다. 저장소에서 자체 경로를 문서화할 수 있습니다.

    스킬에 첫 브랜드 및 design-system 작업 과제를 제공합니다

    스킬 자체의 용어로 작성되었습니다. 대괄호 부분은 각자의 자료로 교체합니다.

    Starter prompt
    Review [marketing-email.html] for brand voice consistency and validate [hero-image.png] against our logo usage rules and color palette. Update docs/brand-guidelines.md with the new tagline and sync the changes to design tokens.

    출처: 스킬 자체의 용어로 SKILL.md에서 작성했습니다.

    첫 번째 결과 확인

    SKILL.md 자체가 올바른 결과의 모습으로 제시하는 내용:

    • 추출된 색상을 브랜드 팔레트와 비교합니다
    • 브랜드 일관성 체크리스트에 따라 콘텐츠를 검토합니다
    • 공개 전 승인 체크리스트에 따라 에셋을 확인합니다

    OpenDesign에서는 SKILL.md 링크로부터 브랜드를 가져옵니다: Plugins → Add → Skill → Import from link, 그다음 상단 바에서 선택합니다.

    OpenDesign 다운로드빠른 시작 가이드 읽기

    05 오픈 소스, 추적 가능

    출처, 라이선스 및 검증

    이 페이지의 사실이 어디에서 왔으며 언제 마지막으로 확인되었는지 안내합니다.

    Author
    nextlevelbuilder
    Repository
    github.com/nextlevelbuilder/ui-ux-pro-max-skill 브랜치 main
    스킬 파일
    .claude/skills/brand/SKILL.md 검증 시 기록된 콘텐츠 체크섬; 커밋 7f69fed
    License
    MIT LICENSE에서 확인
    리포지토리 스타
    127,450 이 카탈로그에 7개의 스킬을 포함하는 전체 nextlevelbuilder/ui-ux-pro-max-skill 저장소에 대해 2026-09-14에 촬영된 GitHub 스냅샷입니다. brand에 대한 평가 또는 사용 횟수가 아닙니다.
    OpenDesign에서 검증됨
    2026-09-14 소스 파일, 경로, 라이선스 텍스트 및 스타 수가 확인되었습니다. OpenDesign 메인에 번들로 포함되지 않음(2026-08-28 확인); 이 페이지에 실제 실행 기록이 없습니다.

    SKILL.md 내부

    1. 사용 시점보이스 정의, 시각적 아이덴티티, 메시징, 일관성 검토, 에셋 관리, 색상 및 타이포그래피 등 여섯 가지 시나리오를 나열합니다.
    2. 스크립트 경로스크립트 경로는 프로젝트 루트가 아니라 스킬 디렉터리를 기준으로 상대 경로임을 설명합니다.
    3. 빠른 시작브랜드 컨텍스트를 주입하고, 에셋을 검증하고, 색상을 추출하거나 비교하는 명령어입니다.
    4. 브랜드 동기화 워크플로우3단계 프로세스: 가이드라인 수정, 토큰으로 동기화, 주입 스크립트로 확인.
    5. 하위 명령브랜드 아이덴티티를 모든 디자인 시스템에 동기화하는 update 하위 명령이 포함된 표입니다.
    6. 참조보이스, 시각적 아이덴티티, 메시징, 일관성, 가이드라인, 에셋, 색상, 타이포그래피, 로고, 승인을 다루는 열 개의 참조 파일입니다.
    7. 스크립트컨텍스트 주입, 토큰 동기화, 에셋 검증, 색상 추출을 위한 네 개의 스크립트입니다.
    8. 템플릿새 브랜드 가이드라인을 작성하기 위한 스타터 템플릿 한 개입니다.
    9. 라우팅3단계 라우팅: 첫 번째 인자에서 하위 명령 파싱, 참조 로드, 나머지 인자로 실행.
    스킬 자체 설명
    "브랜드 보이스, 시각적 아이덴티티, 메시징 프레임워크, 자산 관리, 브랜드 일관성. 브랜드 콘텐츠, 톤 앤 보이스, 마케팅 자산, 브랜드 규정 준수, 스타일 가이드 작업에 활성화합니다."

    SKILL.md의 프런트 매터 설명입니다. 전체 파일은 약 3,512자입니다. GitHub에서 전체 파일 읽기.

    Brand

    실제 브랜드 및 디자인 시스템 작업 태스크에서 brand를 실행하십시오.

    OpenDesign을 다운로드하고 SKILL.md 링크에서 brand를 가져온 다음 위의 프롬프트를 붙여넣고 결과 전에 계획을 읽으십시오.

    OpenDesign 다운로드모든 스킬 보기
    터미널
    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill brand

    OpenDesign 데스크톱

    하나의 디자인 시스템으로 모든 결과물에 브랜드 일관성을

    완전한 Vibe Design Workspace에서 하나의 브랜드 규칙을 웹사이트, 슬라이드, 인터랙티브 프로토타입, 대시보드, 이미지, HTML 영상에 적용하세요. 로컬 Codex, Claude Code, Cursor 등을 연결해 무료로 제작할 수 있습니다.

    • 웹, 슬라이드, 프로토타입, 대시보드, 이미지, 영상
    • 140개+ 디자인 시스템과 전체 템플릿·스킬 라이브러리
    • 로컬 Codex 및 21개+ 코딩 에이전트 연결 · 무료
    무료 다운로드

    macOS, Windows 지원