---
name: xxd-palette-applier
description: Apply Chinese traditional color palettes to concrete design surfaces. Use when a user has colors but needs placement rules for a poster, webpage, landing page, app screen, card, packaging layout, PPT, social cover, editorial page, or visual system.
---

# xxd-palette-applier

## Purpose

Use this skill after a palette exists. Its job is to decide where each color goes, how much area it gets, and what it is not allowed to do.

## Pain Points This Solves

- A palette looks good as swatches but fails once placed into a real layout.
- Designers often overuse the most beautiful color, making CTA, title, decoration, and background compete.
- Different surfaces need different placement logic; a poster rule should not be copied directly into a UI or PPT deck.

## Data Contract

- Use the bundled references inside this skill:
  - `references/chinese-color-master-list.md`: full 742-color Markdown source list.
  - `references/chinese-color-harmony.csv`: complete machine-readable harmony table for all 742 colors.
  - `references/chinese-color-harmony.md`: Markdown version of the same harmony relationships.
- If a palette came from outside the project, map its HEX values to nearest traditional colors before final placement.
- Do not add colors unless repairing a real failure; explain every replacement.
- If the user provides a screenshot or layout description, diagnose the current hierarchy before suggesting placement.

## Surface-Specific Workflow

1. Identify the surface and the primary reading path:
   - Poster or cover: first glance, title, secondary text, signature/detail.
   - Website or app: canvas, surface, text, action, state, focus.
   - PPT or editorial: page rhythm, headline, body, callout, diagram.
   - Packaging: front panel, product name, variant, legal text, seal, side panel.
2. Convert colors into job roles:
   - Ground: large quiet fields.
   - Content: title, body, label, caption.
   - Action: CTA, link, selected state, active object.
   - Rhythm: section bands, dividers, cards, repeated structure.
   - Detail: ornament, number, badge, stamp, small highlight.
3. Set a hierarchy ladder. The strongest contrast belongs to the most important message, not the prettiest color.
4. Assign area ratios:
   - Large field: 50% to 75%.
   - Structure and content: 15% to 35%.
   - Accent: 3% to 10%.
   - Detail: under 3%.
5. Add placement constraints for the specific surface.
6. List the misuse cases that would break the design.

## Output Shape

- Surface diagnosis: what this layout needs from color.
- Role map: role, color name, HEX, component or area, ratio.
- Reading path: where the eye lands first, second, third.
- Placement rules: surface-specific instructions, not generic color labels.
- Misuse checklist: 3 concrete failures to avoid.
- Follow-up: accessibility, token, brand, or print skill if needed.

If the palette cannot safely support the requested layout, say which role is missing before inventing fixes.