Skip to content

Latest commit

 

History

51 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ART+COM Agent Skills

A collection of reusable AI agent skills by ART+COM. Each skill gives AI coding agents domain-specific knowledge so they can work effectively with our libraries and tools.

Available Skills

Skill Description
prototyping Scaffold and deploy password-protected ART+COM web prototypes with GitLab, Netlify, and optional MQTT support
mqtt-topping Connect to MQTT brokers, subscribe/publish messages, and query retained data over HTTP using mqtt-topping
figma-to-react Translate a Figma design into React code that matches the target project's own styling, tokens, and components
skill-selection Pick the most specific matching skill (project > org/custom > bundled plugin) and complete its required steps instead of stopping at "it renders"
react-pixel-overlay Set up and use react-pixel-overlay, the PerfectPixel-style design overlay for verifying pixel-perfect React implementations against design exports
figma-sync Track drift between Figma designs and generated code with the figma-sync CLI — baseline design + code hashes, report sync status per component, and gate CI on design drift
figma-preflight Preflight a Figma file for design-to-code fidelity before codegen — detect source-fixable defects (unbound colors, collapsed surface tokens, substituted fonts) and report or repair them in Figma
react-transition-performance Diagnose and fix janky view transitions in a React app — profile first to identify which frame phase is at fault, then apply the fix that phase actually needs

Installation

Install skills with the skills CLI:

# List available skills in this repo
npx skills add artcom/agent-skills --list

# Install a specific skill
npx skills add artcom/agent-skills --skill mqtt-topping

# Install the prototyping skill
npx skills add artcom/agent-skills --skill prototyping

# Install all skills, to every detected agent
npx skills add artcom/agent-skills --all

# Install to specific agents only
npx skills add artcom/agent-skills --skill mqtt-topping -a claude-code

# Install globally (available across all projects)
npx skills add artcom/agent-skills --skill mqtt-topping -g

# Install all skills, globally, to Claude Code only
npx skills add artcom/agent-skills --skill '*' -a claude-code -g -y

Gotcha: --all always installs to every detected agent and ignores an -a filter — running --all -a claude-code still fans out into every agent's folder. To scope "all skills" to one agent, use --skill '*' instead of --all, as in the last example above.

Skills are symlinked into your project's .agents/skills/ directory and become available to your AI agent automatically. Use --copy if you prefer independent copies instead of symlinks.

Confirm what's installed for one agent with npx skills ls -g -a claude-code. If a previous --all run left skills in the wrong agents' folders, clean them up and reinstall scoped:

# Remove all globally-installed skills from every agent
npx skills remove --skill '*' --agent '*' -g -y

# Then reinstall scoped to the agent you actually want
npx skills add artcom/agent-skills --skill '*' -a claude-code -g -y

Updating installed skills

Update an installed skill to the latest published version with:

npx skills update prototyping -p -y

Skills.sh updates from the original source; it does not define a per-skill version field. Use annotated, per-skill Semantic Versioning Git tags for immutable releases, for example prototyping-v1.0.0. Create a patch tag for fixes, a minor tag for backwards-compatible behavior, and a major tag for breaking workflow changes. Keep main as the latest version.

Versioning and releasing skills

Version each skill independently with an annotated tag named <skill-name>-vMAJOR.MINOR.PATCH. The tag, not the repository-wide commit count, is the immutable release identifier. main remains the current development and installation source.

  • Patch (v0.1.1): Correct instructions, scripts, or examples without changing the expected workflow.
  • Minor (v0.2.0): Add a backwards-compatible capability, integration, or optional workflow step.
  • Major (v1.0.0): Remove or rename a skill, or change required workflow behavior, defaults, or integration contracts in a way that existing users must adapt to.

For each release:

  1. Merge the skill change to main and validate the affected skill.

  2. Create an annotated tag on that exact commit, with a short release summary:

    git tag -a prototyping-v1.0.1 -m "Release prototyping v1.0.1"
    git push origin prototyping-v1.0.1
  3. Describe the user-visible change in the annotated tag message or the Git hosting release notes.

Checking versions

npm test verifies that every skill's metadata.version matches the newest heading in its CHANGELOG.md. Add npm run check:bumped (which is --since main) to also require that a skill whose SKILL.md changed has a changed metadata.version — the two ways versions have drifted here are a bump that outran its changelog, and an edit that never bumped at all. Both run without dependencies and are worth wiring into a pre-commit hook:

git config core.hooksPath .githooks   # if you add one

skills-lock.json records a content hash for an installed copy. It helps detect whether a local copy matches its source, but it is not a release version. To identify a release, use the per-skill Git tag.

Repository Structure

This repository hosts multiple skills side-by-side. Each skill lives in its own directory under skills/:

skills/
├── prototyping/
│   ├── SKILL.md
│   └── scripts/
├── mqtt-topping/
│   └── SKILL.md
└── <future-skill>/
    └── SKILL.md

Every skill directory must contain a SKILL.md with YAML frontmatter (name, description) and markdown instructions. The description drives when the AI agent activates the skill — it should cover both what the skill does and the contexts in which it's useful.

Developing a Skill Locally

Installing via npx skills add copies or symlinks a snapshot — editing skills/<name>/SKILL.md afterward doesn't affect what your agent sees. dev-link.sh symlinks a skill's folder straight from this repo into an agent's global skills directory, so edits are picked up immediately with no reinstall step:

./dev-link.sh link              # link every skill to Claude Code
./dev-link.sh link prototyping  # link just one skill
./dev-link.sh status            # show what's currently linked
./dev-link.sh unlink prototyping

When you're done, unlink and go back to the published version with npx skills update.

Adding a New Skill

  1. Create a new directory under skills/<skill-name>/

  2. Add a SKILL.md with frontmatter and instructions:

    ---
    name: my-skill
    description: Short description of what this skill does and when to use it.
    ---
    
    # My Skill
    
    Instructions for the AI agent...
  3. Optionally add supporting files (scripts/, references/, assets/)

  4. Add an entry to the Available Skills table above

  5. Commit and push

Resources

About

ART+COM agent skills providing on-demand context for our software

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages