image

Generate, edit, and optimize marketing images using AI models and design tools.

Updated Aug 13, 2026
One-click install
npx skills add https://github.com/imMamdouhaboammar/marketing-skills --skill image-immamdouhaboammar
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: image
Source: https://github.com/imMamdouhaboammar/marketing-skills/tree/main/skills/image
Command: npx skills add https://github.com/imMamdouhaboammar/marketing-skills --skill image-immamdouhaboammar

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Creating marketing visuals — blog heroes, social graphics, product mockups, banners, and OG images — requires choosing the right tool, writing effective prompts, matching platform dimensions, and optimizing files for web performance, which is time-consuming without expert guidance. ## Core Features & Use Cases - AI Image Generation Guidance: Compares Gemini/Nano Banana, Flux, Ideogram, GPT Image, Midjourney, Recraft, and Stable Diffusion with a decision tree for text rendering, brand consistency, editing, and cost. - Platform-Specific Workflows: Provides exact dimensions and best practices for blog heroes, social media graphics, profile banners, directory listings, and OG images. - Image Optimization: Covers WebP/AVIF formats, compression commands, lazy loading, and CDN strategies to protect page speed. - Use Case: You need a hero image for a blog post plus five social variants. The skill recommends generating the concept with Flux or Gemini at 1200x630, then using Canva Magic Resize for platform-specific exports, and compressing to WebP under 200KB. ## Quick Start Ask the agent to create a 1200x630 blog hero image for your next post, including a ready-to-use AI generation prompt and optimization steps.

Frequently Asked Questions about image

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a blog hero image with AI?

Use Flux or Gemini for photorealistic heroes, or Ideogram if the image needs text. Write a prompt following Subject + Setting + Style + Lighting + Composition + Technical specs, specify 1200x630, then compress to WebP under 200KB.

Which AI image model is best for text in images?

Ideogram 3.0 has the best text rendering accuracy for headlines and taglines. Gemini and GPT Image handle short text decently, but keep requests to 3-5 words and add longer text in post-processing instead.

Can AI generate screenshots of my product UI?

No. AI models hallucinate interfaces, so the result will not match your real product. Capture actual screenshots at 2x resolution with browser DevTools, Shottr, or CleanShot X, then frame them in device mockups.

What image format should I use on my website?

Use WebP as the default with JPEG or PNG fallback via the picture element or a CDN. AVIF offers higher compression, PNG suits transparency and screenshots, and SVG is best for logos and icons.

How do I create OG images for every blog post automatically?

Use programmatic generation with Vercel OG (@vercel/og), Satori, or Cloudinary. Build one branded template, then inject post metadata like title and author to generate unique 1200x630 images per page.

What size should a Twitter/X header banner be?

Twitter/X headers are 1500x500 (3:1 ratio). Keep critical content centered because the avatar overlaps part of the banner, use minimal text, and test readability at actual display size.