How do I install the Primevue Openprops Architect skill?

Run npx skillmds@latest add heyeddi-com/primevue-openprops-architect-2 in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

What does the Primevue Openprops Architect skill do?

Enforces PrimeVue + project design tokens when editing Vue or CSS. OpenProps rules apply only when the project already uses open-props. Runs vue-tsc and stylelint when available. It is listed under Web & Frontend on SkillMD.

Is Primevue Openprops Architect safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Primevue Openprops Architect?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Primevue Openprops Architect free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Primevue Openprops Architect?

HeyEddi-com (@heyeddi-com) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Primevue Openprops Architect by heyeddi-com

Name: Primevue Openprops Architect
Author: HeyEddi-com

File contents

PrimeVue + project tokens

Enforces PrimeVue and the project's semantic token system. OpenProps is optional — detect before enforcing OpenProps-specific rules.

When chained from parent skills, validate_vue.py runs in a shell subagent by default. See reference/subagents.md.

When to use

Editing .vue single-file components or project stylesheets
Agent is about to add UI components, tokens, or layout
Validating generated Vue against team design system

Instructions

Read context/VOCABULARY.md and context/ANTI_PATTERNS.md before writing UI code.
Read heyeddi-design/reference/token-strategy.md — detect OpenProps vs custom tokens.css.
Reuse PrimeVue components from the project catalog — never invent props.
Use semantic CSS variables from project tokens.css / design.md — OpenProps-backed (var(--surface-1)) or custom (var(--brand)). No scattered hex in .vue / CSS.
After edits, run python scripts/validate_vue.py --project-root <root>.
Fix all reported issues before finishing.

Scripts

validate_vue.py — runs vue-tsc --noEmit and stylelint if installed

Frequently asked questions

Primevue Openprops Architect