How-to · Design & Creative · By Posit

How to use Brand.yml in your AI agent

Install and use the Brand.yml skill in Claude Code, Cursor, Codex, Gemini CLI, OpenCode, and Windsurf — with sample prompts.

What you'll get

Brand.yml lets you create a single file that captures your brand guidelines—colors, typography, logos—and automatically applies them across Shiny apps and Quarto documents. Non-developers can define their brand once and have it consistently show up in dashboards, reports, and presentations without touching code. It's a central source of truth for visual identity that works with tools designers and marketers already use.

Step 1 — Get the skill source URL

The Brand.yml skill lives at:

Step 2 — Add it to your AI agent

Copy one of these prompts and paste it into your AI tool. The agent will fetch and install the skill for you.

Claude Code

Add the agent skill from https://github.com/posit-dev/skills/tree/main/brand-yml to my project.

Cursor

Install this agent skill: https://github.com/posit-dev/skills/tree/main/brand-yml

Codex

Add this skill to .codex/skills/: https://github.com/posit-dev/skills/tree/main/brand-yml

Gemini CLI

Add the skill at https://github.com/posit-dev/skills/tree/main/brand-yml to my .gemini/skills/ directory.

OpenCode

Install this agent skill from https://github.com/posit-dev/skills/tree/main/brand-yml

Windsurf

Add this skill: https://github.com/posit-dev/skills/tree/main/brand-yml

Step 3 — Try these prompts

Once the skill is installed, ask your AI things like:

  • Setting up brand guidelines for a team's reports and dashboards
  • You need consistent colors and fonts across multiple documents without manual styling
  • Creating Shiny apps or Quarto reports and want them to match your brand
  • Update your brand palette once and have it apply everywhere

What this skill does

  • Creates a single YAML file that stores your brand colors, fonts, and logo files
  • Automatically applies your branding to Shiny web apps and Quarto documents
  • Supports light and dark mode variants for colors and logos
  • Integrates with Google Fonts and custom typography
  • Works across HTML reports, dashboards, slides, and PDFs
Made byPosit
CategoryDesign & Creative