Introducing Imager X Skills for AI coding agents

AI agents often understand the general idea of image transforms and responsive images, but not necessarily the finer details of how Imager X actually works and how to use it efficiently. So I decided to teach them.

The project gives AI coding agents detailed knowledge about Imager X, so they can do a much better job of helping with transforms, configuration, responsive images, modern image formats, Power Pack features, GraphQL, and more.

Based on the actual plugin

One thing that was important to me was making the skill useful beyond the kind of information an AI could already piece together from a few documentation pages.

The skill has been built and verified against the actual Imager X source code, so it includes both the common stuff and some of the less obvious details around how transforms, parameters, transformers and other features behave.

The goal is pretty simple: fewer made-up APIs, fewer examples that look convincing but don’t quite work, and more answers that are actually useful when you’re building a site.

That means you should be able to ask your coding agent things like:

Make this hero image responsive with AVIF and a JPEG fallback.

I'm migrating from Imgix to Bunny, is there anything in this project that needs to be changed?

Set up automatic transform generation.

Audit responsive sizes across all templates and optimize the number of total transforms generated.

Why is this transform not behaving the way I expect?

…and have it start from a decent understanding of Imager X instead of improvising.

What it covers

The skill includes knowledge about the main Imager X APIs and workflows, including transforms, named transforms, configuration, automatic generation, transformers, modern formats, GraphQL and the Power Pack.

I’ve also included practical guidance for common real-world use cases, like responsive heroes, card grids, art direction and other patterns that tend to come up again and again. It knows what modern best practices for responsive images look like, and can optimize your LCPs, sizes attributes, and more.

It's got detailed knowledge about the different transformers that Imager X has, and can help you choose the right one, or switch from one to another if need be.

It also knows about differences between Imager X Lite and Pro, which should help avoid the classic AI move of confidently recommending a feature you don’t actually have.

Installing it

For Claude Code, you can install Imager X Skills as a plugin:

/plugin marketplace add spacecatninja/imager-x-skills

/plugin install imager-x@imager-x-skills

It also supports the Skills CLI:

npx skills add spacecatninja/imager-x-skills

So you can use it with supported coding agents such as Claude Code, Cursor, Copilot, Codex, and others.

Or you can just clone it and run install.sh from the root of the repo to set up simple symlinks into your skills directory.

Once it’s installed, there’s no special magic phrase required. Just work with Imager X as you normally would and let the agent use the skill when it needs it.

Open source

Imager X Skills is open source and available on GitHub: github.com/spacecatninja/imager-x-skills

If you’re already using Imager X together with an AI coding agent, give it a try! Hopefully it saves a bit of time, produces better answers, and means we can all spend slightly less time correcting very confident robots.