I built a Claude skill that encodes the Pando Design System, from its components and tokens to its accessibility standards, content guidelines, and authoring patterns. Once loaded, Claude produces on-system output by default across Claude Code, Figma Make, and chat, without re-explaining the rules every session.
Most AI tools will generate an interface on request, but without the system’s context the output drifts toward the wrong component, colors that miss contrast requirements, and tokens that don’t exist. The skill closes that gap by giving Claude the same context I would give a colleague.
The skill is named pando-design-system and triggers on a slash command, or automatically whenever a request touches Pando, a Pando component, @pluralsight/react, or a Pando token. It is built around a SKILL.md that starts with an AI behavior contract, the rules for how Claude should respond to any Pando request, including always citing the relevant component guideline file when it recommends or explains a component. Beneath that sit a guideline file for each component and reference files for the foundations, covering accessibility, content guidelines, component selection, and the color tokens.
In practice it covers the everyday work a design system team gets pulled into, from building UI with the React components and applying tokens, to reviewing designs, annotating Figma files for specs and focus order, auditing for contrast and accessibility, and answering the constant “which component should I use” questions. The same context is available in Claude Code, in Claude chat, and through the Pando Figma Make integration, so it follows the work as it moves between engineering, design, and writing.
Development ran concurrently with the team’s Figma Make work. As the skill matured it took precedence and shaped what was shared with the Figma Make project, since more of the day-to-day work was moving through Claude. The skill is shared internally with Pluralsight’s Claude users, and I am its sole contributor today.
The reception from the team made the effort worth it. After I shared the skill internally and walked designers and PMs through using it, the response came back quickly and generously, with people thanking me for the work and starting to try it on real screens. One comment, from a design leader, framed why this kind of work matters right now:
Skill building like this is a hugely advantageous skillset, an emerging differentiator in the market today. Definitely would consider this a portfolio piece.
Next steps are a few complementary skills aimed at developer workflows, like migration help from PSDS Classic to Pando, Code Connect authoring, and accessibility review. Each is built on the same foundations as the design skill, so Pando stays the single source as the tooling around it grows.