image-generation
Generate illustration images for articles and documentation with a Codex-first workflow, OpenAI API fallback, and Gemini fallback.
By zc277584121 · 3,569 installs
npx skills add zc277584121/marketing-skills --skill image-generation
Source repository · Upstream listing
Image Generation Skill
Generate illustration images for blog posts, documentation, and technical articles. The workflow is provider aware:
1. Codex built in path first — when the current agent is Codex and the built in image gen tool is available, use it directly. This path does not require OPENAI API KEY .
2. OpenAI API fallback — outside Codex, or when the built in tool is unavailable, use the local script with OPENAI API KEY if present.
3. Gemini fallback — if OpenAI API generation is unavailable or fails, use the same script with GEMINI API KEY and the existing Gemini image model.
Load provider specific references only when needed:
Codex built in path: references/codex built in.md
OpenAI API fallback: references/openai api.md
Gemini fallback: references/gemini api.md
When to Use
User asks to generate an illustration, diagram, concept image, article visual, or documentation visual
User is writing an article and needs visual explanations for concepts or workflows
User explicitly asks for a generated raster image
Step 1: Determine the Image Requirements
Before generating, clarify only what is necessary:
1. What to illustrate — the concept, architecture, flow, or scene
2. Language — default to English for both prompt and text in image. Only use another language if the user explicitly requests it
3. Save location — see "Output Path" below
4. Style/color preferences — if user has specific needs, use them; otherwise use the default style
Step 2: Select the Provider Path
Path A: Codex Built In
Use this path when:
The current agent is Codex
The built in image gen tool is available
The user did not explicitly request API/CLI execution
Read references/codex built in.md , generate with the built in tool, then move/copy the final image into the workspace if it is project bound.
Path B: Script Auto Fallback
Use this path when:
The current agent is not Codex
The built in tool is unavailable
The user explicitly asks for API/CLI execution
Run:
The script uses provider auto by default:
1. Try OpenAI API when OPENAI API KEY is set
2. If OpenAI API fails or is not configured, try Gemini when GEMINI API KEY is set
3. If neither credential is available, report the missing environment variables
Step 3: Craft the Prompt
Default Style Prefix
The script automatically prepends this style prefix unless style prefix or no style is used:
Use a clean, modern color palette with soft tones. Minimalist flat illustration style with clear visual hierarchy. Professional and polished look suitable for technical blog articles. No photorealistic rendering. No excessive gradients or shadows.
For the Codex built in path, include the same style guidance directly in the prompt unless the user requested a different style.
Prompt Writing Guidelines
Be specific about visual elements, relationships, and layout
For technical concepts: describe the components and how they connect
For architecture diagrams: list the layers/components and data flow direction
For flow diagrams: describe the steps and direction of flow
If text labels are needed in the image, spell them out explicitly and keep text short
Default language is English; use another language only when requested
Example Prompts
Architecture diagram:
Concept illustration:
Step 4: Parameters
Default Parameters
Parameter Default Notes
Provider auto in script; Codex built in when available Codex built in first, then OpenAI API, then Gemini
OpenAI model gpt image 2 Used by script fallback
Gemini model gemini 3.1 flash image Used by script fallback
Aspect ratio 16:9 Landscape, ideal for article illustrations
Image size 1K Good balance of quality and cost
Style Minimal, clean, soft tones Auto prepended by script
Language English Prompt and in image text
Script Options
When to Change Defaults
Scenario Change
Higher quality final asset image size 2K or openai quality high
Portrait/vertical image aspect ratio 3:4 or aspect ratio 9:16
Square image aspect ratio 1:1
User has their own style style prefix "your style" or no style
Non English content Write prompt in target language
Step 5: Determine Output Path
Follow this priority order:
Priority 1: Context from Current Conversation
If the user is working on a specific markdown file or article:
1. Check where existing images in that article are stored by looking for image references in the .md file
2. Save the new image in the same directory as the existing images
3. Use a descriptive filename that matches the existing naming convention
Example: if the article has  , save to the same images/ directory.
Priority 2: Project Image Directory
If no specific article context but working within a project:
1. Look for existing image directories: images/ , assets/ , static/ , img/ , figures/
2. Save in the most appropriate existing directory
3. If none exists, create an images/ directory at the project root or under the relevant content directory
Priority 3: Fallback
If no clear project context:
1. Save to the current working directory
2. Use a descriptive filename: concept name illustration.png
Step 6: Verify the Result
After generating:
1. Read the image file to visually verify it matches the user's request
2. If the result is not satisfactory, refine the prompt and regenerate once with targeted changes
3. If the image will be inserted into a markdown file, suggest the markdown syntax: 
4. Report which provider path was used and where the final file was saved