Creates branded presentations, LinkedIn carousels, infographics, and HTML pages using brand philosophy, templates, and assets in a project structure with brand-philosophy.md.
From brand-content-designnpx claudepluginhub camoa/claude-skills --plugin brand-content-designThis skill is limited to using the following tools:
references/bias-prevention.mdreferences/brand-philosophy-template.mdreferences/canvas-philosophy-template.mdreferences/carousels-guide.mdreferences/color-palettes.mdreferences/output-specs.mdreferences/presentations-guide.mdreferences/slide-composition-rules.mdreferences/style-constraints.mdreferences/style-recommendation-engine.mdreferences/template-structure.mdProvides UI/UX resources: 50+ styles, color palettes, font pairings, guidelines, charts for web/mobile across React, Next.js, Vue, Svelte, Tailwind, React Native, Flutter. Aids planning, building, reviewing interfaces.
Fetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.
Guides Payload CMS config (payload.config.ts), collections, fields, hooks, access control, APIs. Debugs validation errors, security, relationships, queries, transactions, hook behavior.
Create branded visual content (presentations, LinkedIn carousels, HTML pages) with consistent brand identity.
Before ANY operation, find the PROJECT_PATH using this search order:
./brand-philosophy.md exists../brand-philosophy.md existsfind . -maxdepth 2 -name "brand-philosophy.md" to find nearby projects/brand-init firstOnce PROJECT_PATH is set, the folder structure is:
{PROJECT_PATH}/
├── brand-philosophy.md # Always exists
├── templates/
│ ├── presentations/
│ │ └── {template-name}/
│ │ ├── template.md
│ │ ├── canvas-philosophy.md
│ │ └── sample.pptx
│ ├── carousels/
│ │ └── {template-name}/
│ │ ├── template.md
│ │ ├── canvas-philosophy.md
│ │ └── sample.pdf
│ └── html/
│ └── {design-system-name}/
│ ├── canvas-philosophy.md
│ ├── design-system.md
│ └── components/ # Reusable HTML components
├── presentations/ # Output folder
├── carousels/ # Output folder
├── html-pages/ # Output folder (HTML pages)
└── assets/ # Brand assets
Finding templates:
find {PROJECT_PATH}/templates/presentations -name "template.md"find {PROJECT_PATH}/templates/carousels -name "template.md"Apply this layered approach when creating content:
Layer 1 - Brand Philosophy (brand-philosophy.md in project)
Layer 2 - Content Type Guide (from plugin references/)
references/presentations-guide.md for presentationsreferences/carousels-guide.md for carouselsLayer 3 - Template (from project templates/)
canvas-philosophy.md for visual design rulesRoute user requests to the appropriate command:
| User Intent | Command |
|---|---|
| Status, switch projects, or start | /brand |
| Initialize new project | /brand-init |
| Extract brand from sources | /brand-extract |
| Generate alternative color palettes | /brand-palette |
| Manage assets (logos, icons, fonts) | /brand-assets |
| Create presentation template | /template-presentation |
| Create carousel template | /template-carousel |
| Get outline template + AI prompt with slide/card definitions | /outline |
| Create presentation (guided) | /presentation |
| Create presentation (quick) | /presentation-quick |
| Create carousel (guided) | /carousel |
| Create carousel (quick) | /carousel-quick |
| Create HTML design system | /design-html |
| Create HTML page (guided) | /html-page |
| Create HTML page (quick) | /html-page-quick |
| Add new content type | /content-type-new |
Use these skills during content generation:
| Skill | When to Use |
|---|---|
| visual-content | Generate visual output from canvas philosophy (bundled) |
| html-generator | Generate HTML pages and components from design system (bundled) |
| pptx | Convert presentation PDFs to PowerPoint |
| Create multi-page carousel PDFs |
The visual-content skill is bundled with this plugin. For HTML-to-Drupal conversion, use the design-system-converter plugin.
references/brand-philosophy-template.md - Template for brand philosophyreferences/template-structure.md - Template for template.md filesreferences/canvas-philosophy-template.md - Template for canvas philosophyreferences/presentations-guide.md - Presentation best practicesreferences/carousels-guide.md - Carousel best practicesreferences/style-constraints.md - 18 visual styles with enforcement blocksreferences/color-palettes.md - Color theory and palette typesreferences/output-specs.md - Dimensions, formats, file sizesreferences/bias-prevention.md - Brand bias prevention checksreferences/style-recommendation-engine.md - Intelligent style selection by brand personality, purpose, audiencereferences/slide-composition-rules.md - Per-slide-type focal points, layout modifiers, component frequency limitsFor design system recognition and analysis methodology, use the dev-guides-navigator plugin:
Invoke /dev-guides-navigator with keywords like "design system recognition", "Bootstrap mapping", or "component analysis". The navigator handles caching and disambiguation — never fetch dev-guides URLs directly.