# ui theme designer — Agent Skill

Plugin for coding agents working with UI theme designer. Bundles two skills: how-to and conceptual answers about UI theme designer on BTP, and questions about the SAP Design System and SAP Fiori design tokens — theme parameters and component-level parameter usage in UI5, UI5 Web Components, and Fundamental Styles.

## At a glance

ui-theme-designer is an Agent Skill by SAP in the Design & Creative category. In Claude Code it installs with `/plugin install ui-theme-designer@claude-plugins-official` after adding the anthropics/claude-plugins-official marketplace; other assistants use its SKILL.md instructions as rules. Its source repository has 7 GitHub stars (as of Oct 28, 2026).

## Install

### How to install ui theme designer in Claude Code

1. Add the marketplace

```claude
/plugin marketplace add anthropics/claude-plugins-official
```

2. Install the skill

```claude
/plugin install ui-theme-designer@claude-plugins-official
```

3. Use it

   These are slash commands for a Claude Code session, not your shell. Claude auto-invokes the skill when your request matches its description — or type its slash command if it exposes one.

### How to install ui theme designer in Claude Desktop

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Add the SKILL.md to your Skills folder

   Settings → Capabilities → Skills → add the folder containing SKILL.md. Claude picks it up automatically.

### How to install ui theme designer in Cursor

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Convert to a Cursor rule

   Create .cursor/rules/ui-theme-designer.mdc and paste the SKILL.md body. Set `alwaysApply` or a glob so the Agent loads it in context.

### How to install ui theme designer in Codex CLI

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Reference in AGENTS.md

   Add the skill's instructions (or a link) to AGENTS.md at your repo root — Codex reads it on every run.

### How to install ui theme designer in Windsurf

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Add to your rules / context

   Paste the SKILL.md instructions into this tool's custom rules or workspace instructions so the agent follows them.

### How to install ui theme designer in Cline

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Add to your rules / context

   Paste the SKILL.md instructions into this tool's custom rules or workspace instructions so the agent follows them.

### How to install ui theme designer in VS Code

1. Clone the source

```bash
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents.git
```

2. Find the skill

   It lives in ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer — that folder contains the SKILL.md.

3. Add to your rules / context

   Paste the SKILL.md instructions into this tool's custom rules or workspace instructions so the agent follows them.

Source: https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents/tree/main/plugins/ui-theme-designer

---

Source: https://mcp-skills-hub.vercel.app/skills/ui-theme-designer · MCP Skills Hub · data as of 2026-10-28T12:31:05Z