image

Generates and optimizes marketing images using AI models, design tools, and web performance best practices.

Updated Jul 14, 2026
One-click install
npx skills add https://github.com/usmangurowa/sifter --skill image-usmangurowa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: image
Source: https://github.com/usmangurowa/sifter/tree/main/.agents/skills/image
Command: npx skills add https://github.com/usmangurowa/sifter --skill image-usmangurowa

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 AI model, dimensions, and optimization strategy, which is time-consuming and error-prone without expert guidance. ## Core Features & Use Cases - AI Image Generation Guidance: Compares Gemini, 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 workflows for blog heroes, social graphics (Twitter, LinkedIn, Instagram, Facebook), profile banners, and directory listings like Product Hunt. - Image Optimization & OG Images: Covers WebP/AVIF formats, compression commands, lazy loading, and programmatic OG image generation with Vercel OG, Satori, or Cloudinary. - Use Case: You need a hero image for a blog post plus five social media variants — the Skill recommends generating the concept with Flux, resizing via Canva Magic Resize, and exporting WebP under 200KB. ## Quick Start Ask the assistant to create a 1200x630 blog hero image for your next post, including a 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?

Define a visual metaphor for your topic, then generate with Flux or Gemini for photorealistic styles or Ideogram if you need text in the image. Specify 1200x630 so it works as both hero and OG image, 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 of any model, making it ideal for headlines and branded graphics. Gemini and GPT Image handle short text decently, but keep requests to 3-5 words for reliability.

Can AI generate screenshots of my product UI?

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

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), which builds images at the edge from JSX templates, or Satori and Cloudinary for template-based overlays. Build one branded template and inject post metadata to generate unique 1200x630 images per page.

What are the correct social media image dimensions?

Twitter/X uses 1200x675, LinkedIn 1200x627, Instagram feed 1080x1080 (or 1080x1350), Stories 1080x1920, and Facebook 1200x630. Create the concept at the highest resolution, then use Canva Magic Resize for platform variants.