skills.rest
ferrarifankid04
ferrarifankid04COMMUNITY
Explore all skills by this author →
GitHub

image

Generates and optimizes marketing images using AI models, design tools, and platform-specific specs.

Updated Aug 6, 2026
Search Tags:#image generation#og image#flux#ideogram#social media graphics#marketing visuals#webp optimization
One-click install
npx skills add https://github.com/ferrarifankid04/ai-skills-public --skill image-ferrarifankid04
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: image
Source: https://github.com/ferrarifankid04/ai-skills-public/tree/main/claude-code/skills/image
Command: npx skills add https://github.com/ferrarifankid04/ai-skills-public --skill image-ferrarifankid04

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, knowing platform dimensions, and optimizing files for web performance, which is time-consuming and error-prone without guidance. ## Core Features & Use Cases - AI Model Selection: 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 best practices for blog heroes, social graphics (Twitter/X, LinkedIn, Instagram, Facebook), profile banners, directory listings, and OG images. - Image Optimization: Covers WebP/AVIF formats, compression commands, lazy loading, and CDN strategies to keep pages fast. - Use Case: You need a hero image for a blog post plus OG preview — the skill recommends Flux or Gemini, supplies a structured prompt at 1200x630, and gives cwebp commands to compress under 200KB. ## Quick Start Ask the agent to create a 1200x630 blog hero image for your post topic and optimize it as WebP for your website.

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, generate at 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 product screenshots or UI mockups?▼

No — AI models hallucinate interfaces, so the result will not match your real product. Capture real screenshots at 2x resolution with 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), Satori, or Cloudinary text overlays. Build one branded template, then inject post metadata dynamically and reference it with og:image meta tags at 1200x630.

What size should a Twitter/X header banner be?▼

Twitter/X headers are 1500x500 (3:1 ratio). Keep text minimal, center critical content since the avatar overlaps the lower left, and test readability at actual display size on mobile.

Related Skills

Explore More Marketing & Sales Skills→
minhnv0807minhnv0807
569

46-brand-guideline

Creates an eight-section brand guideline document covering colors, typography, logo rules, and file naming.

Community
Intermediate
inference-shinference-sh
688

landing-page-design

Optimize landing page layout, hero sections, and CTA psychology for conversion.

Official
Intermediate
techshiv91-celltechshiv91-cell
3

ad-creative

Generate and iterate ad creative across major ad platforms.

Community
Advanced
forestonbike-hubforestonbike-hub

ai-product-video

Convert static product images into cinematic videos with AI motion models.

Community
Advanced