# ui-theme-designer-design-tokens

> Claude/Codex skill by [@sap](https://omgskills.com/library/sap/index.md) · 6 stars · Updated 2026-10-19

TRIGGER: questions about the SAP Design System and SAP Fiori design tokens — which themes exist, what value a theme parameter (e.g. sapButton\_Background, sapHighlightColor) has in a given theme, how parameters inherit/extend across the theme chain, which parameters a specific UI component (UI5 control, UI5 Web Component, Fundamental Styles component) consumes. SKIP: how-to questions about UI theme designer as a product (creating, publishing, transporting themes — use ui-theme-designer-help).

Tags: claude-code, design-tokens, fiori, sap, ui-theme-designer

## Install

```sh
git clone https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents /tmp/ui-theme-designer-plugins-for-coding-agents && ln -s /tmp/ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer/skills/ui-theme-designer-design-tokens ~/.claude/skills/ui-theme-designer-design-tokens
```

## From README

Design Tokens With $THIS being the folder that contains this SKILL.md: Prerequisite $THIS/nodemodules/ exists and is not older than 7 days; if not: cd $THIS && npm ci Context Design Tokens are defined in LESS files of the theming-base-content, and consumed in LESS and CSS files of different frameworks (= UI technologies). In $THIS/nodemodules/ you find the following: UI5: (with $LIBRARY being e.g. sap.ui.core, and $THEME being e.g. saphorizon) $THIS/nodemodules/@openui5/$LIBRARY/src/${LIBRARY/./\\//}//themes/base contains the baseTheme of the different libraries $THIS/nodemodules/@openui5/themelib$THEME/src/${LIBRARY/./\\//}/themes/ contains the $THEME of the different libraries UI5 Web Components: (with $THEME being e.g. saphorizon, and $COMPONENT being e.g.

## Links

- HTML page: https://omgskills.com/library/sap/ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer/skills/ui-theme-designer-design-tokens/
- GitHub: https://github.com/SAP/ui-theme-designer-plugins-for-coding-agents
- Author: [@sap](https://omgskills.com/library/sap/index.md)

## More from this repo

- [ui-theme-designer-help](https://omgskills.com/library/sap/ui-theme-designer-plugins-for-coding-agents/plugins/ui-theme-designer/skills/ui-theme-designer-help/index.md) — Provides customer-facing UI theme designer help from help.sap.com (BTP / Cloud Foundry edition).
   - [@sap](https://omgskills.com/library/sap/index.md) · 6 stars
