This one walks you through building complete brand identities from scratch, starting with discovery questions about your audience and values, then generating logo concepts as actual SVG React components you can drop into your codebase. It includes ready-to-use color palettes with full shade ranges (50-900), typography systems with CSS variables, and brand guideline templates that cover logo usage rules, spacing, and accessibility. The approach is practical, giving you both the strategic framework (competitor analysis, brand positioning) and the implementation details (Tailwind configs, component code). If you're building a product and need a cohesive visual identity without hiring a design agency, this gets you from brand brief to working assets with clear guardrails on how to use everything consistently.

skills.sh installs
1.3K
GitHub stars
39
last updated
Aug 21, 2026

Install

$ npx -y skills add daffy0208/ai-dev-standards --skill brand-designer --agent claude-code

Installs into .claude/skills of the current project.

Files

Brand Designer Skill

I help you create cohesive brand identities, logos, and visual brand systems.

What I Do

Brand Identity:

  • Logo design and variations
  • Color palettes
  • Typography systems
  • Brand guidelines

Visual Assets:

  • Business cards, letterheads
  • Social media templates
  • Marketing materials
  • Brand presentation decks

Brand Strategy:

  • Brand positioning
  • Target audience definition
  • Competitor analysis
  • Brand voice and tone

Logo Design Process

Step 1: Brand Discovery

Questions to Answer:

  • What does the company do?
  • Who is the target audience?
  • What are the brand values?
  • What feeling should the logo evoke?
  • Any colors/symbols to avoid?

Example Brief:

## Brand Brief: TechStart

**Industry:** SaaS, developer tools
**Target Audience:** Software developers, 25-40 years old
**Brand Values:** Innovation, simplicity, reliability
**Personality:** Modern, technical, approachable
**Competitors:** GitHub, GitLab, Vercel

**Logo Requirements:**

- Works in monochrome
- Scales from 16px (favicon) to billboard
- Modern, not trendy (should age well)
- Unique, memorable

Step 2: Logo Concepts

Sponsors

Details

Repository
github.com/daffy0208/ai-dev-standards
Categories
AI & Agent Building, Marketing & SEO, Design & UI/UX

More from daffy0208/ai-dev-standards

All 49
1ailabs-393 avatarseo-optimizerailabs-393/ai-labs-claude-skillsThis skill should be used when analyzing HTML/CSS websites for SEO optimization, fixing SEO issues, generating SEO reports, or implementing SEO best practices. 1.3Kskills.sh installs
2langchain-ai avatarquery-writinglangchain-ai/deepagentsWrites and executes SQL queries from simple SELECTs to complex multi-table JOINs, aggregations, and subqueries. Use when the user asks to query a database, writ1.3Kskills.sh installs
3langchain-ai avatarschema-explorationlangchain-ai/deepagentsLists tables, describes columns and data types, identifies foreign key relationships, and maps entity relationships in a database. Use when the user asks about 1.3Kskills.sh installs
4github avatarreact19-test-patternsgithub/awesome-copilotProvides before/after patterns for migrating test files to React 19 compatibility, including act() imports, Simulate removal, and StrictMode call count changes.1.3Kskills.sh installs
5pulumi avatarpulumi-automation-apipulumi/agent-skillsLoad this skill when a user asks how to run Pulumi programmatically, embed Pulumi in an application, orchestrate multiple stacks in code, build a self-service i1.2Kskills.sh installs
6jasonjgardner avatarblockbench-animationjasonjgardner/blockbench-mcp-projectCreate and manage animations in Blockbench using MCP tools. Use when animating 3D models, creating keyframes, managing bone rigs, editing animation curves, or w1.2Kskills.sh installs