# How to Integrate GPT-Image2 Skill with Claude Code or Codex: Complete Setup Guide > Learn to integrate GPT-Image2 skill with Claude Code or Codex using the skills CLI, npm scripts, or marketplace commands for AI image prompt generation directly from repository style definitions. - Repository: [苍何/awesome-gpt-image-2](https://github.com/freestylefly/awesome-gpt-image-2) - Tags: how-to-guide - Published: 2026-09-01 --- **You can integrate the GPT-Image2 Style Library skill into Claude Code or Codex using the `skills` CLI, npm scripts, or marketplace commands, enabling AI agents to generate optimized image prompts directly from the repository's style definitions.** The **GPT-Image2 Style Library** in the `freestylefly/awesome-gpt-image-2` repository is packaged as a portable agent skill that works across multiple AI coding environments. Located at `agents/skills/gpt-image-2-style-library/`, this skill reads from [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) to provide Claude Code and Codex with structured prompt templates for GPT-Image2 generation. ## Understanding the GPT-Image2 Skill Architecture Before installing, it helps to understand how the skill components fit together. The integration relies on a YAML-based skill manifest and a JSON data source that stays synchronized with the web UI. ### Skill Definition and Data Sources The skill architecture centers on two primary files: - **[`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md)** – Located at [`agents/skills/gpt-image-2-style-library/SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/agents/skills/gpt-image-2-style-library/SKILL.md), this YAML front-matter file defines the skill's name, purpose, workflow, and output defaults. Claude Code and Codex parse this manifest to understand how to invoke the skill. - **[`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json)** – This master data file contains all style entries, categories, tags, and example case IDs. At runtime, the skill reads this JSON file to assemble prompts dynamically, ensuring agents use the same style definitions as the web interface. ### Generation and Installation Scripts The repository provides automation scripts defined in [`package.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/package.json): - **`npm run generate:style-skill`** – Executes `scripts/generate-style-skill.mjs` to rebuild [`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md) and related assets from [`style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/style-library.json) whenever the library changes. - **`npm run install:skill`** – Copies the generated skill files into local agent directories (`~/.claude/skills` for Claude Code and `~/.codex/skills` for Codex). ## Installation Methods for Claude Code and Codex You have three primary ways to integrate the GPT-Image2 skill into your agent environment. Choose the method that best fits your workflow. ### Method 1: Using the skills CLI The `skills` NPM package provides a universal installer that works for both Claude Code and Codex simultaneously. Install for specific agents: ```bash npx skills add freestylefly/awesome-gpt-image-2 \ --skill gpt-image-2-style-library \ --agent claude-code codex \ --global --yes --copy ``` Install for all supported agents at once: ```bash npx skills add freestylefly/awesome-gpt-image-2 \ --global --all --copy ``` **Explanation:** The `npx skills add` command fetches the repository, extracts the skill definition, and copies it into the global skill directories. The `--agent` flag targets specific installations, while `--all` expands to every supported agent including Claude Code, Codex, and Cursor. ### Method 2: Claude Code Marketplace Commands If you prefer working within the Claude Code interface, use the built-in marketplace commands: ``` /plugin marketplace add freestylefly/awesome-gpt-image-2 /plugin install gpt-image-2-style-library@awesome-gpt-image-2 ``` These commands register the repository in Claude Code's plugin marketplace and install the specific skill version. This method is ideal when you want to manage skills through Claude Code's native interface rather than command-line tools. ### Method 3: npm-Based Installation For developers who prefer global npm packages, the repository provides a thin CLI wrapper: ```bash npm install -g gpt-image-2-style-library gpt-image-2-style-library install all ``` This approach installs the package globally, then uses the `gpt-image-2-style-library` binary to copy the skill into both `~/.claude/skills` and `~/.codex/skills` directories in one operation. ## Regenerating the Skill After Library Updates When you modify [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) or add new style templates, you must regenerate and reinstall the skill for changes to take effect in your agents: ```bash npm run generate:style-skill # Rebuilds SKILL.md from style-library.json npm run install:skill # Copies updated skill to agent directories ``` Run these commands from the repository root after any changes to the master style data. The generation script converts the JSON entries into the structured format that Claude Code and Codex expect in the skill manifest. ## How the Skill Works at Runtime Once installed, the skill operates through a four-phase workflow: 1. **Invocation** – You prompt the agent with a natural language request like: "Use gpt-image-2-style-library to create an infographic prompt about machine learning." 2. **Template Selection** – The agent loads [`style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/style-library.json) from the skill directory to identify the appropriate template based on category tags and example case IDs. 3. **Prompt Construction** – Following the workflow defined in [`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md), the skill assembles prompt blocks (subject, composition, style specifications) into a cohesive GPT-Image2 prompt structure. 4. **Output** – The agent returns a copy-ready prompt formatted for the GPT-Image2 API, which you can use directly in the web UI or through server-side Vercel functions. The skill maintains consistency between the web interface and agent environments by sourcing all definitions from the single [`style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/style-library.json) file. ## Summary - The **GPT-Image2 Style Library skill** resides in `agents/skills/gpt-image-2-style-library/` and uses [`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md) for agent configuration along with [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) for style definitions. - **Installation options** include the `npx skills add` command for universal setup, Claude Code's `/plugin` marketplace commands for native integration, or global npm installation for development workflows. - **Directory locations** for installed skills are `~/.claude/skills` for Claude Code and `~/.codex/skills` for Codex. - **Update workflow** requires running `npm run generate:style-skill` followed by `npm run install:skill` whenever the underlying JSON data changes. - At runtime, the skill parses natural language requests, queries the style library, and returns structured GPT-Image2 prompts ready for API consumption. ## Frequently Asked Questions ### Where is the GPT-Image2 skill defined in the repository? The skill definition lives at [`agents/skills/gpt-image-2-style-library/SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/agents/skills/gpt-image-2-style-library/SKILL.md), which contains the YAML front-matter describing the skill's capabilities, workflow, and default parameters. The actual style data is sourced from [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) at runtime, ensuring the agent always uses the current template collection. ### Can I use the same skill installation for both Claude Code and Codex? Yes. The `npx skills add` command with the `--agent claude-code codex` flag (or `--all` flag) copies the skill to both `~/.claude/skills` and `~/.codex/skills` directories simultaneously. Alternatively, running `gpt-image-2-style-library install all` from the global npm package handles both agents in a single operation. ### What happens when I modify the style-library.json file? Changes to [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) do not automatically update installed skills. You must run `npm run generate:style-skill` to rebuild the [`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md) and related assets from the updated JSON, followed by `npm run install:skill` to push the regenerated files into your local Claude Code and Codex skill directories. ### How does the skill construct prompts for GPT-Image2? When invoked, the skill reads [`style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/style-library.json) to match your request against available categories and tags. It then follows the workflow defined in [`SKILL.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/SKILL.md) to assemble structured prompt blocks—including subject definition, compositional guidelines, and style specifications—into a final prompt string optimized for the GPT-Image2 API.