Image logo

Image

Community
j1ngg
image

Generates marketing images using the mcp-image MCP server. Reads brand guidelines for style consistency. Supports social posts, blog headers, ads, and presentation visuals.

Overview

Publisherj1ngg
Repositorytech-marketing-framework
Skill nameimage
Stars
59
Forks
8
Bundled files
Instructions only
LicenseMIT
Links
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • Self-contained

    Everything the model needs lives in the instructions — no extra files to sync.

  • Open source

    Published by j1ngg on GitHub. Read the source before you install it.

Installation

Install the Image AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
    https://github.com/j1ngg/tech-marketing-framework/tree/main/.claude/skills/image
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/j1ngg/tech-marketing-framework.git /tmp/tech-marketing-framework
mkdir -p .claude/skills
cp -r /tmp/tech-marketing-framework/.claude/skills/image .claude/skills/image
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Image in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Image on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Image is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

Marketing Image Generator

This skill generates images for marketing assets using the mcp__mcp-image__generate_image MCP tool. It reads brand guidelines to maintain visual consistency and constructs optimized prompts for each use case.

Prerequisites

Required: The mcp-image MCP server must be configured and running.


Step 1: Check Brand Guidelines

Before generating any images, read docs/inputs/brand_guidelines.md.

If it exists and is filled in: Extract visual style, color palette, mood, motifs, composition preferences, and restrictions. Use these to constrain every prompt.

If it exists but is still a template (placeholder values): Tell the user:

"Your brand guidelines at docs/inputs/brand_guidelines.md are still the default template. I can generate images without them, but results will be generic. Would you like to fill in the guidelines first?"

If the user wants to proceed without guidelines, use sensible defaults: clean, minimal, professional, tech-focused.


Step 2: Gather Inputs

Ask the user:

  1. What is this image for?

    • Social media post (LinkedIn, Twitter)
    • Blog featured image
    • Ad creative
    • Presentation slide
    • Other (describe)
  2. Source content — What should the image represent?

    • File path to the content it accompanies
    • Description of the concept
    • Or let the skill extract the concept from context (if already in a content generation flow)
  3. Reference image — (Optional) Do you have a reference image for style matching?

    • If yes, provide the absolute file path

Wait for answers before proceeding.


Step 3: Select Format

Based on the use case, select the appropriate aspect ratio and resolution:

Use CaseAspect RatioResolutionNotes
LinkedIn post16:92KHorizontal, feed-optimized
Twitter post16:92KHorizontal, timeline-optimized
Blog featured image16:92KStandard blog header
LinkedIn ad1:12KSquare format for sponsored content
Meta ad4:52KVertical, mobile feed-optimized
Presentation slide16:92KHorizontal, projector-friendly
Instagram post1:12KSquare format

Confirm the format with the user before generating. If the user requests a custom aspect ratio, use the closest supported option from the tool (1:1, 2:3, 3:2, 3:4, 4:3, 4:5, 5:4, 9:16, 16:9, 21:9).


Step 4: Construct the Prompt

Build the prompt in three layers:

Layer 1: Style (from brand guidelines)

Extract from docs/inputs/brand_guidelines.md:

  • Visual style (e.g., "minimalist tech illustration")
  • Color palette (e.g., "dark navy background, electric blue and white accents")
  • Mood (e.g., "professional, innovative, bold")
  • Visual motifs (e.g., "geometric shapes, abstract connections")

Layer 2: Concept (from source content)

Derive the visual concept from the source content. Rules:

  • Abstract over literal. Represent the concept, not a screenshot of the product.
  • One focal point. Do not try to illustrate every idea in the content.
  • Pick the single most visually interesting element from the source.

Layer 3: Restrictions (fixed + brand guidelines)

Always include:

  • "No text, no words, no letters, no labels, no typography"
  • "No photorealistic human faces"
  • "Clean composition with clear focal point"
  • Any brand-specific restrictions from guidelines

Prompt Template

[Style: visual style, color palette, mood from brand guidelines]

[Concept: single visual idea derived from source content]

[Composition: layout guidance based on use case]

No text, no words, no letters, no labels, no typography. No photorealistic human faces. Clean composition with clear focal point. [Additional brand restrictions]

Prompt rules:

  • Keep prompts under 200 words. Shorter prompts produce more coherent images.
  • Use concrete visual descriptions, not abstract marketing language.
  • Specify colors by name and relationship ("dark navy background with electric blue accent lines"), not hex codes.
  • Describe spatial relationships ("left side", "center", "flowing from left to right").
  • Include lighting direction if relevant ("backlit", "soft ambient glow").

Step 5: Generate

Call the MCP tool with the constructed parameters:

mcp__mcp-image__generate_image(
  prompt: [constructed prompt],
  aspectRatio: [from format table],
  imageSize: [from format table],
  purpose: [use case description],
  quality: "quality",
  fileName: [descriptive file name]
)

File naming: [context]-[concept]-[use-case] (e.g., beyond-identity-agent-governance-linkedin, ceros-credential-flow-blog-header)

If a reference image was provided: Include inputImagePath with the absolute path.

After generation, read the output image and present it to the user.


Step 6: Review and Refine

After presenting the image, ask:

"Want to iterate on this, or is it good?"

Refinement

If the user wants changes, adjust the prompt based on their feedback. Common adjustments:

FeedbackPrompt Adjustment
"Too busy / complicated"Reduce elements, add "minimal, sparse, lots of negative space"
"Too dark"Shift to "light background, bright, well-lit"
"Too generic"Add more specific visual motifs from the source content
"Wrong colors"Explicitly name the desired colors
"Too many words/labels"Strengthen the no-text restriction: "absolutely no text, no labels, no annotations, no typography of any kind"
"Not abstract enough"Remove concrete objects, add "abstract, geometric, flowing shapes"

Maximum 5 refinement rounds. After 5 attempts:

"We've done 5 rounds. To get closer to what you want, I'd recommend:"

  1. Providing a reference image that captures the style you're after
  2. Updating brand guidelines with more specific visual direction
  3. Trying a completely different visual concept

Output

Images are saved to output/images/ automatically by the MCP tool.

After the image is approved, provide:

Image: output/images/[filename].jpg
Dimensions: [aspect ratio] at [resolution]
Prompt: [the prompt used, for future reference]
Alt text: [SEO-friendly description, under 125 characters]

Alt Text Rules

  • Describe what is visually in the image, not the topic of the content
  • 125 characters or fewer
  • No "image of" or "picture of" prefix
  • Include key visual elements and colors

Multi-Image Generation

When generating images for a set of assets (e.g., a blog post + social posts promoting it), maintain visual consistency:

  1. Use the same style layer across all prompts
  2. Vary the concept layer to match each asset's focus
  3. Keep the color palette consistent
  4. Adjust only the aspect ratio and composition per format

Adaptation Notes

  • When brand guidelines are sparse: Default to clean, minimal, dark backgrounds with blue/white accents. Flag that results will improve with specific guidelines.
  • When source content is highly technical: Focus on abstract representations. Do not try to literally illustrate architecture diagrams or code flows.
  • When the tool generates text despite instructions: This is a known limitation of image generation models. Strengthen the no-text restriction and simplify the prompt. If text persists, note that the user can crop or overlay in post-production.
  • When used alongside other skills: If called after /social-posts, /blog, or /ads, extract the concept directly from the generated content without re-asking the user.

Frequently asked questions

What does the Image AI skill do?

Generates marketing images using the mcp-image MCP server. Reads brand guidelines for style consistency. Supports social posts, blog headers, ads, and presentation visuals.

Why use Image on TypingMind?

Because you install it once and use it with any model. Image is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Image in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/j1ngg/tech-marketing-framework/tree/main/.claude/skills/image. TypingMind reads its SKILL.md and installs it as a skill you can enable per chat.

Which AI models can use Image?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Image?

As many as you like. As long as a model supports skills, you can use Image with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Image AI skill free?

Yes. It is published on GitHub by j1ngg under the MIT license. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

View all

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇