Agent skill

Brand Design

by EliasOulkadi in EliasOulkadi/shokunin

Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.

MITAuto-check passedFrontend & Design

Install Brand Design

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.pack/skills/brand-design .claude/skills/brand-design && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .claude/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.pack/skills/brand-design .agents/skills/brand-design && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .agents/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.pack/skills/brand-design .cursor/skills/brand-design && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .cursor/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/EliasOulkadi/shokunin.git --path .pack/skills/brand-design

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.pack/skills/brand-design .gemini/skills/brand-design && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .gemini/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .github/skills && cp -r skills-src/.pack/skills/brand-design .github/skills/brand-design && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .github/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add EliasOulkadi/shokunin --skill brand-design -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install EliasOulkadi/shokunin brand-design --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/EliasOulkadi/shokunin.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.pack/skills/brand-design .opencode/skills/brand-design && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "brand-design" agent skill from https://github.com/EliasOulkadi/shokunin/tree/master/.pack/skills/brand-design into .opencode/skills/brand-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "brand-design", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: brand-design
GitHub stars: 114
Token cost: ~3k tokens
SKILL.md length: 1,200 words
Files: 1
Skills in repo: 49
Repo updated: Oct 5, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.

Works in 9 steps: Project overview: what and why (2-3… → Problem statement: "[User] cannot [goal]… → Objectives: SMART → …
Tasks that involve Logo and visual identity
SKILL.md covers Workflow: Brand / Design…, Error Handling, Brand Guidelines and Design System Audit Checklist, plus 8 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Brand Design is an agent skill from EliasOulkadi/shokunin. Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.

Its SKILL.md is about 3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts. Compatibility notes: opencode

It sits in Frontend & Design, covering Logo and visual identity, Brand strategy and identity and Design systems. The repository describes itself as: 職人 Shokunin 62 AI agent skills for OpenCode, Claude Code, Cursor, Windsurf. ChromaDB memory, MCP servers, declarative self-updates. Multi-model, open source, zero cost. The licence is MIT.

When your agent uses it

Tasks that involve Logo and visual identity
Tasks that involve Brand strategy and identity
Tasks that involve Design systems

Example prompts

“/brand-design”

Requirements

Compatibility (from SKILL.md): opencode

Workflow steps

9 steps, taken from the first numbered list in SKILL.md.

Project overview: what and why (2-3 sentences)
Problem statement: "[User] cannot [goal] because [barrier]"
Objectives: SMART
Target audience: demographics, behaviors, goals, pain points, anti-audience
Scope: what's in and explicitly out
Deliverables: format, quantity, specs, revision rounds
Timeline: phases, milestones, review points, buffer
Success criteria: testable, with metrics and targets
Constraints: budget, technology, brand, legal, timeline

What it can do on your machine

Read from SKILL.md and the folder at commit 4c68e5b. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are json).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Compatibility
opencode
From compatibility in the SKILL.md frontmatter.

Context cost

Brand Design loads about 3k tokens when it runs. Until then it costs about 48 tokens; SKILL.md has 1,200 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~48
When it runs · the whole SKILL.md, loaded when a task matches: ~3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from EliasOulkadi/shokunin at commit 4c68e5b, republished under its MIT licence (© EliasOulkadi). 1,200 words, ~2,967 tokens.

Download SKILL.mdSave it as .claude/skills/brand-design/SKILL.md (or your agent's skills folder).

name: brand-design
description: Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.
compatibility: opencode
triggers: brand guidelines, style guide, design brief, creative brief, campaign concept, brand identity, visual identity, design system, creative direction, brand…
negatives: UI component design patterns, landing page layout, responsive design, icon set creation, color palette generation
license: MIT
metadata.workflow: productivity
metadata.audience: developers
metadata.version: 3.0.0

Brand Design Skill v3.0

Brand identity, design systems, creative direction, and project briefs.

Workflow: Brand / Design System Creation

Follow this numbered process. Do not skip steps.

Step	Action	Output
1	Gather inputs: brand story, competitors, audience research, technical constraints	Brief document
2	Define brand strategy: positioning, personality (3-5 adjectives), tone of voice	Brand strategy doc
3	Build color system: primary, neutral, semantic palettes + WCAG AA checks	Color tokens + palette
4	Select typography: headline/body pairing, scale, line-height, responsive sizing	Typography tokens
5	Define spacing, radius, shadow, motion tokens (W3C format)	Design tokens JSON
6	Create logo variations + usage guidelines	Logo guidelines
7	Apply to 3+ touchpoints: web, print, social, or environmental	Application mockups
8	Run design system audit (see checklist below)	Audit report
9	Document anti-patterns and error states	Error + anti-pattern docs
10	Stakeholder review + alignment sign-off	Approved design system v1.0

Error Handling

Error	Cause	Fix
Color contrast fails WCAG AA	Luminance ratio < 4.5:1 for text	Darken or lighten until ratio passes. Use `contrastRatio` in tokens.
Token mismatch across platforms	Figma tokens != code tokens	Single source of truth: W3C JSON. Export from design tool.
Typography scale gaps	Missing intermediate sizes	Build scale with modular scale (1.25 or 1.333 ratio).
Logo illegible at min size	Too much detail in icon	Use simplified lockup or separate wordmark + icon variants.
Design brief scope creep	Unclear out-of-scope list	Explicit "what's NOT included" section. Reference during reviews.
Stakeholder disagreement	No clear decision authority	Identify single approver in brief. Escalate to DRI.
Campaign fails originality axis	Cliché or derivative idea	Force 5+ directions. Run through SCAMPER/TRIZ. Reference culture, not competitors.

Brand Guidelines

A complete brand system has 9 sections: brand story, logo, color, typography, spacing, imagery, voice, application, anti-patterns.

Color Palette

Primary (2-4 colors, 60%+ of touchpoints):

Role	Hex	Usage
Primary	#1B365D	Headlines, primary buttons
Accent	#F5BD47	CTAs, highlights

Neutral (grays for UI):

Name	Hex	Usage
Dark	#080808	Headings
Mid	#666666	Body text
Light	#E0E0E0	Borders
Surface	#F5F5F5	Backgrounds

Semantic: Success #2ECC71, Warning #F39C12, Error #E74C3C, Info #3498DB

Design Tokens (W3C Format)

json

{
  "color": {
    "primary": { "$value": "#1B365D", "$type": "color" },
    "accent": { "$value": "#F5BD47", "$type": "color" },
    "surface": { "$value": "#F5F5F5", "$type": "color" }
  },
  "spacing": {
    "xs": { "$value": "4px", "$type": "dimension" },
    "sm": { "$value": "8px", "$type": "dimension" },
    "md": { "$value": "16px", "$type": "dimension" },
    "lg": { "$value": "32px", "$type": "dimension" }
  },
  "borderRadius": {
    "sm": { "$value": "4px", "$type": "dimension" },
    "md": { "$value": "8px", "$type": "dimension" },
    "full": { "$value": "9999px", "$type": "dimension" }
  }
}

Typography

Element	Weight	Size	Line Height
Display H1	Bold	clamp(2.5rem,5vw,4.5rem)	1.1
H2	Bold	clamp(1.75rem,3vw,2.5rem)	1.2
H3	Semibold	clamp(1.25rem,2vw,1.75rem)	1.25
Body	Regular	1rem (16px)	1.6
Caption	Regular	0.75rem	1.4

Body text minimum 16px. Line length 45-75 chars. Contrast min 4.5:1 (WCAG AA).

Font Pairing Examples:

Style	Headline	Body
Premium editorial	Playfair Display	Source Sans Pro
Modern SaaS	Inter	Inter
Creative agency	Syne	Plus Jakarta Sans
Luxury	Cormorant Garamond	Proxima Nova

Logo Guidelines

Variations: primary, secondary, icon (32x32), wordmark
Clear space = height of "H" on all sides
Min size: 80px digital, 1.5in print
Never stretch, recolor, rotate, add effects, or use on low-contrast backgrounds

Tone of Voice

Dimension	Rule
Personality	3-5 adjectives (e.g. confident, warm, precise)
Vocabulary	Use "we/you". Avoid "one/our users"
Formality	Casual for social, formal for investor comms
Humor	In social/email. Never in legal, support, or crisis

Design System Audit Checklist

All colors have hex/RGB/HSL values and usage guidelines
Typography scale covers 6+ sizes with line-height
Spacing scale (4/8/16/24/32/48/64px)
Component library matches design tokens
Dark mode variants defined
Accessibility: all color combos pass WCAG AA 4.5:1
Icons: consistent stroke width, corner radius, size grid
Shadow/elevation system defined
Motion: duration, easing, reduced-motion alternative
Form elements: all states (default, hover, focus, error, disabled)
Breakpoints match design tool
Figma component properties mapped to code props

Production Checklist

Before shipping any design system or brand guidelines:

Check	Criteria	Owner
Color parity	Hex values match exactly between Figma + code + docs	Design + Dev
Token export	W3C JSON exported and imported into codebase	Design
Font licensing	All typefaces have valid web + print licenses	Prod Mgr
Logo rasterization	Vector + PNG + favicon exported at all required sizes	Design
Accessibility audit	Automated + manual passes (axe, color contrast, keyboard nav)	QA
Dark mode	All colors have dark mode variants, no hardcoded values	Design
Responsive breakpoints	Layout tested at mobile, tablet, desktop	Dev
Motion reduced	`prefers-reduced-motion` respected for all animations	Dev
Component states	All interactive elements defined: default, hover, focus, active, error, disabled	Design
Figma dev handoff	Components published with props, variants, and descriptions	Design

Creative Direction

Ideation Methodologies

Methodology	Best for
SCAMPER	Product innovation, rebranding
Design Thinking	Human-centered problem solving
TRIZ (40 principles)	Technical problem solving
Bisociation	Connecting two unrelated frameworks
Synectics (analogies)	Creative campaigns
SIT	Innovation with constraints
Blue Ocean Strategy	Market differentiation

Show full SKILL.md (492 more words)Show less

Campaign Architecture

Level	Timeframe	What
Brand platform	3-5 years	Positioning
Campaign theme	Annual	What we say this year
Creative executions	Per asset	How we bring it to life
Tactical adaptations	Per channel	How it works in this medium

Campaign Idea Evaluation (5-axis)

Axis	Passing	Fail
Originality (1-10)	7+	Below 5
Relevance (1-10)	8+	Below 6
Impact (1-10)	7+	Below 5
Feasibility (1-10)	6+	Below 4
Durability (1-10)	6+	Below 4

Score min 3 axes at 7+ to proceed.

Design Brief

Structure

Project overview: what and why (2-3 sentences)
Problem statement: "[User] cannot [goal] because [barrier]"
Objectives: SMART
Target audience: demographics, behaviors, goals, pain points, anti-audience
Scope: what's in and explicitly out
Deliverables: format, quantity, specs, revision rounds
Timeline: phases, milestones, review points, buffer
Success criteria: testable, with metrics and targets
Constraints: budget, technology, brand, legal, timeline

Stakeholder Alignment Questions

Who has final approval?
What's the single most important metric?
What can we deprioritize if scope shrinks?
Who are we NOT designing for?
What are the non-negotiables (legal, brand, technical)?

Anti-Patterns

Anti-Pattern	Why It Fails	Fix
No single-minded proposition	Message dilutes, audience confused	Force one idea. Kill the rest.
Problem stated as solution	Brief prescribes fix instead of framing the real issue	Describe the problem, not the fix
Vague success criteria	Cannot measure success or failure	Define specific, testable criteria with targets
No constraints given	Design that looks great but can't be built or shipped	Add budget, tech, timeline constraints upfront
Too many stakeholders	Design by committee produces mediocrity	Identify single DRI per decision type
Skipping audience insight	Design solves wrong problem	Research first. Find a non-obvious truth.
Chasing trends	Looks dated in 6 months, no differentiation	Reference culture, not competitors
Falling in love with first idea	Biased evaluation, better solutions missed	Force 5+ directions before selecting
Designing for yourself	End-user needs subordinated to designer preferences	User test with real audience segments
No error states defined	UI breaks silently, bad UX	Define error, empty, loading states for every component

Design Token Architecture

json

{
  "color": {
    "primary": { "value": "#1B365D", "type": "color" },
    "primary-light": { "value": "#2D5A8A", "type": "color" }
  },
  "spacing": {
    "xs": { "value": "4px", "type": "spacing" },
    "sm": { "value": "8px" }, "md": { "value": "16px" }, "lg": { "value": "24px" }
  },
  "typography": {
    "heading": { "value": { "fontFamily": "Charter", "fontWeight": 500, "fontSize": "clamp(32px,5vw,56px)" } }
  }
}

Export as W3C Design Token format for Figma Tokens plugin, Style Dictionary, or token-transformer.

Figma-to-Code Handoff

Dev Mode: inspect spacing (8px grid), colors (variables), typography (named styles)
Export assets: SVG for icons, PNG @2x for raster
Component mapping: FigmaComponent → ReactComponent documented before build
Responsive: Figma frames at 375px (mobile), 768px (tablet), 1440px (desktop)

Sources

Pentagram — brand identity project standards
NASA Graphics Standards Manual
Stripe Brand Guidelines
W3C Design Tokens Format
IDEO design thinking methodology
Ogilvy "On Advertising"
Design Council UK "Double Diamond"
NN Group "How to Write a Design Brief"
Figma Design Tokens plugin

Checklist

Skill loads without errors in the AI agent
YAML frontmatter is valid (description, compatibility, audience)
Workflow section provides clear step-by-step instructions
Error handling section covers common failure modes
All referenced files (references/, scripts/, assets/) exist
Skill triggers correctly for intended use cases
No broken links or missing resources

Files

Just SKILL.md in .pack/skills/brand-design of EliasOulkadi/shokunin.

Open the folder on GitHubat commit 4c68e5b

Compare with similar skills

Brand Design next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Brand Design compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Brand Design this skillEliasOulkadi/shokunin	114	—	~3k	Automated safety check: Pass	MIT	6 days ago
DesignOhh-889/skyroc	795	9 repos	~3.1k	Automated safety check: Pass	MIT	1 mo ago
Cavekit Design SystemJuliusBrussee/caveman-code	942	—	~4.5k	Automated safety check: Pass	MIT	1 mo ago
Replica DesignJakeschincariol/replica-skill	1.4k	—	~994	Automated safety check: Pass	MIT	8 days ago
Brand SystemsHermeticOrmus/LibreUIUX-Claude-Code	112	—	~2.3k	Automated safety check: Pass	MIT	6 days ago
Shadcn Tailwind UILiarMTTT/TavernWeave	154	—	~1.7k	Automated safety check: Pass	Custom licence	7 days ago

Similar skills

Design
Ohh-889/skyroc
Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations…
795 GitHub starsUsed in 9 repos~3.1k tokens
Frontend & DesignAuto-check passed
Cavekit Design System
JuliusBrussee/caveman-code
How to write and maintain DESIGN.md as the visual specification layer for Cavekit projects.
942 GitHub stars~4.5k tokensUpdated 1 mo ago
Frontend & DesignAuto-check passed
Replica Design
Jakeschincariol/replica-skill
Rebuilds an app's design system for a clone: colour roles, type scale, spacing, radius, shadows and every component with its states, as design tokens plus component specs, with original assets…
1.4k GitHub stars~994 tokensUpdated 8 days ago
Frontend & DesignAuto-check passed
Brand Systems
HermeticOrmus/LibreUIUX-Claude-Code
Brand identity building blocks: positioning, personality, archetypes, logo systems, color palettes, type pairing, voice, and guidelines documentation.
112 GitHub stars~2.3k tokensUpdated 6 days ago
Frontend & DesignAuto-check passed
Shadcn Tailwind UI
LiarMTTT/TavernWeave
Build, restyle, or review accessible React interfaces that use shadcn/ui, Radix UI primitives, and Tailwind CSS.
154 GitHub stars~1.7k tokensUpdated 7 days ago
Frontend & DesignAuto-check passed
Form Brand
jeremylongshore/tons-of-skills-marketplace
A skill your agent uses when asked to create a brand identity, define visual design direction, generate a color palette or type system, build a style guide, or establish the look and feel for a…
2.8k GitHub stars~2.1k tokensUpdated yesterday
Frontend & DesignAuto-check: notes

Questions about Brand Design

What does Brand Design do?

Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria. Brand Design is an agent skill from EliasOulkadi/shokunin. Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.

When should I use Brand Design?

Brand Design fits situations like: tasks that involve Logo and visual identity; tasks that involve Brand strategy and identity; tasks that involve Design systems.

How do I install Brand Design in Claude Code?

Run `npx skills add EliasOulkadi/shokunin --skill brand-design -a claude-code`. Or copy the skill folder (.pack/skills/brand-design in EliasOulkadi/shokunin) into .claude/skills/brand-design in your project. Claude Code loads it when a task matches its description.

How do I install Brand Design in Codex?

Run `npx skills add EliasOulkadi/shokunin --skill brand-design -a codex`. Or copy the skill folder (.pack/skills/brand-design in EliasOulkadi/shokunin) into .agents/skills/brand-design in your project. Codex loads it when a task matches its description.

Can I use Brand Design in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add EliasOulkadi/shokunin --skill brand-design -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/brand-design, .gemini/skills/brand-design, .github/skills/brand-design and .opencode/skills/brand-design in your project.

What does Brand Design need to run?

SKILL.md names no scripts, command-line tools or credentials: Brand Design is instructions for the agent only. Compatibility (from SKILL.md): opencode.

Does Brand Design access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Brand Design safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Brand Design use?

Brand Design is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Brand Design use?

About 3k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Brand Design?

Skills that share tags, products or a category with Brand Design: Design (Ohh-889/skyroc, 795 stars), Cavekit Design System (JuliusBrussee/caveman-code, 942 stars), Replica Design (Jakeschincariol/replica-skill, 1.4k stars) and Brand Systems (HermeticOrmus/LibreUIUX-Claude-Code, 112 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Brand Design?

EliasOulkadi (a GitHub user) maintains it in EliasOulkadi/shokunin, which has 114 GitHub stars. The repository holds 49 skills in this directory. The repository was last updated on October 5, 2026.

Source: EliasOulkadi/shokunin on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Install Brand Design

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Compatibility

Context cost

Safety

SKILL.md

Brand Design Skill v3.0

Workflow: Brand / Design System Creation

Error Handling

Brand Guidelines

Color Palette

Design Tokens (W3C Format)

Typography

Logo Guidelines

Tone of Voice

Design System Audit Checklist

Production Checklist

Creative Direction

Ideation Methodologies

Campaign Architecture

Campaign Idea Evaluation (5-axis)

Design Brief

Structure

Stakeholder Alignment Questions

Anti-Patterns

Design Token Architecture

Figma-to-Code Handoff

Sources

Checklist

Files

Compare with similar skills

Similar skills

More from EliasOulkadi/shokunin

Related

Questions about Brand Design