[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6DHYC2Y4PS2JB0JCQ8KD1XD":3,"skill-same:01M6DHYC2Y4PS2JB0JCQ8KD1XD":91},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":28,"publishedAt":49,"linkOnly":50,"markdownContent":51,"markdownBody":52,"frontMatter":53,"refName":67,"commitSha":68,"skillDirectory":69,"forksCount":70,"repositoryHtmlUrl":71,"repositoryHomepageUrl":72,"ownerHtmlUrl":73,"ownerBlogUrl":74,"ownerDescription":75,"updatedAt":76,"install":77,"resources":90},"01M6DHYC2Y4PS2JB0JCQ8KD1XD","brand-identity-generator",null,"Generates complete brand identity systems with color psychology, typography pairings, and visual identity rules mapped to Universal Design System palettes. Use when the user asks for brand identity, brand design, brand colors, style guide, or visual identity.","mkatogui\u002Funiversal-design-system","mkatogui","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F60530366?v=4","01M6DHY93EKKMDVZVMRK0HNR2G","Marcelo Katogui","01M6DHY98VP1MWVA1SD456FSXG",5,"MIT","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fbrand-identity\u002FSKILL.md",[18,23],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000015","视觉设计","SCENARIO","使用场景",{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48],"brand identity generator","identity","brand","guide","complete","style","systems","brand design","psychology","visual","typography","use","design","Rules","system","voice","logo","guidelines","design system","brand guidelines","2026-11-10 10:12:30",false,"---\nname: brand-identity-generator\ndescription: Generates complete brand identity systems with color psychology, typography pairings, and visual identity rules mapped to Universal Design System palettes. Use when the user asks for brand identity, brand design, brand colors, style guide, or visual identity.\nversion: 0.4.0\ntriggers:\n  - brand identity\n  - brand design\n  - brand colors\n  - brand guidelines\n  - visual identity\n  - brand book\n  - style guide\n  - logo usage\n  - brand voice\n  - color psychology\n  - brand palette\n  - brand typography\n  - brand system\n---\n\n# Brand Identity Generator — Claude Code Skill\n\nGenerate complete brand identity systems with color psychology reasoning, typography pairings, logo guidelines, and visual identity rules — all mapped to Universal Design System's 9 structural palettes.\n\n## How This Skill Works\n\n### Step 1: Gather Brand Context\nAsk for or infer:\n- Company name and industry\n- Brand values (e.g., trustworthy, innovative, friendly)\n- Target audience (age, profession, tech-savviness)\n- Competitors to differentiate from\n- Existing brand colors (if any — to evolve, not replace)\n\n### Step 2: Map to Palette\nUse the industry → palette mapping from Universal Design System:\n\n| Industry | Default Palette | Reasoning |\n|----------|----------------|-----------|\n| Finance\u002FBanking | `corporate` | Trust, stability, professionalism |\n| Healthcare | `minimal-saas` | Calm, clean, accessible |\n| Education | `illustration` | Friendly, approachable, warm |\n| Technology\u002FAI | `ai-futuristic` | Innovation, cutting-edge |\n| Startup | `gradient-startup` | Energy, boldness, momentum |\n| Luxury | `apple-minimal` | Refinement, premium, exclusivity |\n| Fashion | `bold-lifestyle` | Edge, drama, visual impact |\n| Legal\u002FProfessional | `minimal-corporate` | Authority, tradition, sobriety |\n| E-commerce | `minimal-saas` | Clean, product-focused |\n| Kids\u002FChildren | `illustration` | Playful, rounded, warm |\n\n### Step 3: Apply Color Psychology\n\n| Color | Psychology | Best Industries |\n|-------|-----------|----------------|\n| Blue | Trust, stability, calm | Finance, healthcare, tech, corporate |\n| Green | Growth, health, nature | Healthcare, wellness, sustainability |\n| Purple | Creativity, luxury, wisdom | Luxury, creative, education |\n| Red\u002FOrange | Energy, urgency, passion | Food, entertainment, startup |\n| Black | Sophistication, power | Luxury, fashion, tech |\n| Warm neutrals | Warmth, approachability | Professional services, hospitality |\n| Neon\u002FVibrant | Innovation, disruption | Crypto, gaming, AI\u002FML |\n\n### Step 4: Generate Brand System\n\nOutput a complete brand identity including:\n\n1. **Color Palette** — Primary, secondary, accent, neutrals as CSS custom properties\n2. **Typography Pairing** — Heading + body font from the 75 pairings in `src\u002Fdata\u002Ftypography.csv`\n3. **Logo Usage Rules** — Minimum size, clear space, color variants (full color, mono, reversed)\n4. **Brand Voice** — Tone descriptors, writing style, vocabulary guidelines\n5. **Visual Identity Rules** — Border radius, shadow style, animation style, photography direction\n\n### Step 5: Output Format\n\n```css\n\u002F* Brand: [Company Name] *\u002F\n\u002F* Palette: [palette-name] *\u002F\n:root {\n  --brand-primary: #HEXVAL;\n  --brand-secondary: #HEXVAL;\n  --brand-accent: #HEXVAL;\n  --brand-dark: #HEXVAL;\n  --brand-light: #HEXVAL;\n  --brand-bg: #HEXVAL;\n  --brand-text: #HEXVAL;\n  --brand-radius: Xpx;\n  --brand-shadow: ...;\n  --brand-font-display: 'Font Name';\n  --brand-font-body: 'Font Name';\n}\n```\n\n## Examples\n\n### \"Create brand identity for a fintech startup\"\n- **Palette:** `corporate` with gradient accents from `gradient-startup`\n- **Colors:** Navy primary (#1A365D), blue accent (#3B82F6), clean white backgrounds\n- **Typography:** Manrope (headings) + Inter (body) — geometric-modern mood\n- **Voice:** Professional yet approachable, data-driven, reassuring\n- **Radius:** 4-8px (conservative), subtle shadows\n\n### \"Brand identity for a kids learning app\"\n- **Palette:** `illustration`\n- **Colors:** Burnt orange primary (#E8590C), purple accent (#7048E8), warm cream backgrounds\n- **Typography:** Nunito (headings) + Inter (body) — soft-approachable mood\n- **Voice:** Fun, encouraging, simple language, age-appropriate\n- **Radius:** 12-32px (heavily rounded), soft warm shadows\n\n---\n\n*Powered by Universal Design System v0.4.0*\n","# Brand Identity Generator — Claude Code Skill\n\nGenerate complete brand identity systems with color psychology reasoning, typography pairings, logo guidelines, and visual identity rules — all mapped to Universal Design System's 9 structural palettes.\n\n## How This Skill Works\n\n### Step 1: Gather Brand Context\nAsk for or infer:\n- Company name and industry\n- Brand values (e.g., trustworthy, innovative, friendly)\n- Target audience (age, profession, tech-savviness)\n- Competitors to differentiate from\n- Existing brand colors (if any — to evolve, not replace)\n\n### Step 2: Map to Palette\nUse the industry → palette mapping from Universal Design System:\n\n| Industry | Default Palette | Reasoning |\n|----------|----------------|-----------|\n| Finance\u002FBanking | `corporate` | Trust, stability, professionalism |\n| Healthcare | `minimal-saas` | Calm, clean, accessible |\n| Education | `illustration` | Friendly, approachable, warm |\n| Technology\u002FAI | `ai-futuristic` | Innovation, cutting-edge |\n| Startup | `gradient-startup` | Energy, boldness, momentum |\n| Luxury | `apple-minimal` | Refinement, premium, exclusivity |\n| Fashion | `bold-lifestyle` | Edge, drama, visual impact |\n| Legal\u002FProfessional | `minimal-corporate` | Authority, tradition, sobriety |\n| E-commerce | `minimal-saas` | Clean, product-focused |\n| Kids\u002FChildren | `illustration` | Playful, rounded, warm |\n\n### Step 3: Apply Color Psychology\n\n| Color | Psychology | Best Industries |\n|-------|-----------|----------------|\n| Blue | Trust, stability, calm | Finance, healthcare, tech, corporate |\n| Green | Growth, health, nature | Healthcare, wellness, sustainability |\n| Purple | Creativity, luxury, wisdom | Luxury, creative, education |\n| Red\u002FOrange | Energy, urgency, passion | Food, entertainment, startup |\n| Black | Sophistication, power | Luxury, fashion, tech |\n| Warm neutrals | Warmth, approachability | Professional services, hospitality |\n| Neon\u002FVibrant | Innovation, disruption | Crypto, gaming, AI\u002FML |\n\n### Step 4: Generate Brand System\n\nOutput a complete brand identity including:\n\n1. **Color Palette** — Primary, secondary, accent, neutrals as CSS custom properties\n2. **Typography Pairing** — Heading + body font from the 75 pairings in `src\u002Fdata\u002Ftypography.csv`\n3. **Logo Usage Rules** — Minimum size, clear space, color variants (full color, mono, reversed)\n4. **Brand Voice** — Tone descriptors, writing style, vocabulary guidelines\n5. **Visual Identity Rules** — Border radius, shadow style, animation style, photography direction\n\n### Step 5: Output Format\n\n```css\n\u002F* Brand: [Company Name] *\u002F\n\u002F* Palette: [palette-name] *\u002F\n:root {\n  --brand-primary: #HEXVAL;\n  --brand-secondary: #HEXVAL;\n  --brand-accent: #HEXVAL;\n  --brand-dark: #HEXVAL;\n  --brand-light: #HEXVAL;\n  --brand-bg: #HEXVAL;\n  --brand-text: #HEXVAL;\n  --brand-radius: Xpx;\n  --brand-shadow: ...;\n  --brand-font-display: 'Font Name';\n  --brand-font-body: 'Font Name';\n}\n```\n\n## Examples\n\n### \"Create brand identity for a fintech startup\"\n- **Palette:** `corporate` with gradient accents from `gradient-startup`\n- **Colors:** Navy primary (#1A365D), blue accent (#3B82F6), clean white backgrounds\n- **Typography:** Manrope (headings) + Inter (body) — geometric-modern mood\n- **Voice:** Professional yet approachable, data-driven, reassuring\n- **Radius:** 4-8px (conservative), subtle shadows\n\n### \"Brand identity for a kids learning app\"\n- **Palette:** `illustration`\n- **Colors:** Burnt orange primary (#E8590C), purple accent (#7048E8), warm cream backgrounds\n- **Typography:** Nunito (headings) + Inter (body) — soft-approachable mood\n- **Voice:** Fun, encouraging, simple language, age-appropriate\n- **Radius:** 12-32px (heavily rounded), soft warm shadows\n\n---\n\n*Powered by Universal Design System v0.4.0*\n",{"name":5,"version":54,"triggers":55,"description":7},"0.4.0",[56,36,57,48,58,59,60,61,62,63,64,65,66],"brand identity","brand colors","visual identity","brand book","style guide","logo usage","brand voice","color psychology","brand palette","brand typography","brand system","main","b1fb0110c763e490dfa11ab763bfec569ee334d5",".claude\u002Fskills\u002Fbrand-identity",1,"https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system","https:\u002F\u002Fmkatogui.github.io\u002Funiversal-design-system\u002F","https:\u002F\u002Fgithub.com\u002Fmkatogui","katonometrica.com","System Engineer focused on advanced R\u002FShiny architectures, statistical modeling, and production-grade data applications. Trained in Econometrics","2026-05-21 20:04:31",{"source":8,"skillName":5,"commands":78,"prompt":88,"zipAvailable":89},[79,82,85],{"tool":80,"command":81},"npx","npx skills add mkatogui\u002Funiversal-design-system --skill brand-identity-generator",{"tool":83,"command":84},"bunx","bunx skills add mkatogui\u002Funiversal-design-system --skill brand-identity-generator",{"tool":86,"command":87},"pnpm","pnpm dlx skills add mkatogui\u002Funiversal-design-system --skill brand-identity-generator","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fbrand-identity\u002FSKILL.md",true,[],[92,127,151,165,186,209],{"skillNo":93,"name":94,"nameZh":6,"description":95,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":96,"categories":97,"keywords":109,"publishedAt":49},"01M6DJ3R223F6NKTJ63QJCP917","universal-design-system","MAIN skill — Intelligent design system generation. Domain detection, BM25 search, rule engine, palette selection, token resolution, Tailwind\u002FReact\u002FVue\u002FSvelte output. Use when the user wants to build, design, or implement any UI (landing page, dashboard, app, component set, style guide).","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Funiversal-design-system\u002FSKILL.md",[98,101,104,105,106],{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发",{"categoryNo":102,"categoryName":103,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000013","分析与可视化",{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},{"categoryNo":107,"categoryName":108,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000033","数据分析师",[41,47,43,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126],"universal design system","Tailwind","design audit","bm25","chart","app","hex","selection","react native","css","Animation","search","figma","component library","create","react","components",{"skillNo":128,"name":129,"nameZh":6,"description":130,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":131,"categories":132,"keywords":136,"publishedAt":49},"01M6DJ3J205BK44NKF3M5WM71W","ui-styling-assistant","Focused CSS\u002Fstyling helper that answers specific styling questions using Universal Design System tokens. Provides copy-paste CSS snippets with dark mode variants and responsive breakpoints.","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Fui-styling\u002FSKILL.md",[133,134,135],{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},[137,138,139,140,141,142,110,143,144,145,146,147,148,149,111,120,150,47,41,119],"assistant","ui styling","ui","styling","ui styling assistant","hover","input","responsive","snippets","focus","glassmorphism","effect","table","radius",{"skillNo":152,"name":153,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":154,"categories":155,"keywords":160,"publishedAt":49},"01M6DJ3E034YW5AQ3B1YMZT6TX","ui-spec-prd","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Fui-spec-prd\u002FSKILL.md",[156,159],{"categoryNo":157,"categoryName":158,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000031","产品经理",{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},[161,162,139,163,164],"ui spec prd","spec","prd","spec prd",{"skillNo":166,"name":167,"nameZh":6,"description":168,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":169,"categories":170,"keywords":176,"publishedAt":49},"01M6DJ397AAX8QSST26ASFZJQ8","uds-getting-started","Explains how to use the installed Universal Design System skills, pick which ones to use, and add or customize skills in your project. Use when the user asks about getting started with UDS or which skill to use.","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Fuds-getting-started\u002FSKILL.md",[171,172,175],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":173,"categoryName":174,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},[177,178,47,41,179,180,110,40,181,182,183,43,184,185],"getting started","uds getting started","customize","project","install","user","pick","how","start",{"skillNo":187,"name":188,"nameZh":6,"description":189,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":190,"categories":191,"keywords":197,"publishedAt":49},"01M6DJ34HX2B60T7XM0KF4GGDK","slides-design-system","Generates presentation design systems with consistent slide templates, typography rules, and color schemes mapped to Universal Design System palettes. Use when the user asks for slide design, presentation design, or deck templates.","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Fslides-design\u002FSKILL.md",[192,195,196],{"categoryNo":193,"categoryName":194,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000003","演示文稿",{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":24,"categoryName":25,"taxonomyType":26,"taxonomyTypeDesc":27},[47,198,43,199,41,200,40,110,201,35,202,203,39,182,42,204,205,206,207,208],"slides","slides design system","google","pitch deck","layout","deck","template","templates","google slides","design systems","powerpoint",{"skillNo":210,"name":211,"nameZh":6,"description":212,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":213,"categories":214,"keywords":222,"publishedAt":49},"01M6DJ30F0R15GAQSTP2TXDF6J","pre-pr-review","Performs deep review and testing of all code changes before creating a PR. Catches TypeScript errors, lint regressions, SonarCloud code smells, test failures, and output correctness issues that would fail CI. Use when the user asks for pre-PR review, deep review, or CI simulation.","https:\u002F\u002Fgithub.com\u002Fmkatogui\u002Funiversal-design-system\u002Fblob\u002Fmain\u002Fplugins\u002Funiversal-design-system\u002Fskills\u002Fpre-pr-review\u002FSKILL.md",[215,218,219],{"categoryNo":216,"categoryName":217,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000008","测试与质量",{"categoryNo":99,"categoryName":100,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":220,"categoryName":221,"taxonomyType":26,"taxonomyTypeDesc":27},"01JBSEEDCAT000000000000030","开发工程师",[223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238,239,240,40,241],"review","pr review","pre pr review","pr","code quality","pr readiness","lint","testing","typescript","test","deep","readiness","code","issues","deep review","ci","simulation","check","quality check"]