skills.rest
prasanna591
prasanna591COMMUNITY
Explore all skills by this author →
GitHub

banner-design

Generates multi-format banner designs for social media, ads, web heroes, and print with AI-generated visuals.

Updated Aug 30, 2026
Search Tags:#social media#image generation#art direction#ad creative#png export#html css#banner design
One-click install
npx skills add https://github.com/prasanna591/ProblemSolvingMind --skill banner-design-prasanna591
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: banner-design
Source: https://github.com/prasanna591/ProblemSolvingMind/tree/main/.opencode/skills/banner-design
Command: npx skills add https://github.com/prasanna591/ProblemSolvingMind --skill banner-design-prasanna591

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Creating banners across many platforms requires knowing exact dimensions, safe zones, and art direction for each format, which is slow and error-prone when done manually. ## Core Features & Use Cases - Multi-Platform Banner Generation: Produces banners at exact dimensions for Facebook, Twitter/X, LinkedIn, YouTube, Instagram, Google Display Ads, website heroes, and print. - Multiple Art Direction Options: Generates several style variants per request from 22 documented styles including minimalist, gradient, glassmorphism, neon, and editorial. - AI Visual Generation with HTML/CSS Composition: Creates background visuals via Gemini image models, then overlays text, CTA, and logo in HTML/CSS before exporting to PNG at exact pixel sizes. - Use Case: A marketer needs a Twitter/X header (1500x500) and an Instagram story (1080x1920) for a product launch; the skill researches references, generates three style options per size, and exports ready-to-use PNGs. ## Quick Start Ask the assistant to design three minimalist banner options for a Twitter/X header promoting your product launch.

Frequently Asked Questions about banner-design

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

FAQPage Schema
How do I create a banner for multiple social media platforms at once?▼

Specify the platforms and sizes you need, and the workflow generates each banner at exact dimensions such as 1500x500 for Twitter/X headers or 1080x1920 for Instagram stories. Each size gets its own art direction options exported as PNG files.

What banner styles can I choose for ad design?▼

The reference guide documents 22 art direction styles including minimalist, bold typography, gradient, photo-based, glassmorphism, neon/cyberpunk, duotone, and editorial. You can request a specific style or let the workflow propose 2-3 complementary options.

When should I use the Standard versus Pro image generation model?▼

Use the Standard Flash model for backgrounds, gradients, patterns, and quick A/B variants at 2K resolution. Use the Pro model for hero illustrations, product shots, and photorealistic scenes requiring 4K detail.

Does the banner design workflow support print formats?▼

Yes, it covers print banners such as roll-ups and trade show displays with 300 DPI, CMYK color mode, and 3-5mm bleed requirements. It does not handle full print production or video editing.

What are the text and safe zone rules for social media banners?▼

Critical content must stay within the central 70-80% of the canvas, with one CTA per banner at minimum 44px height. Ad text should stay under 20% of the image to avoid Meta penalties, with a maximum of two typefaces.

Related Skills

Explore More Design & Creative Skills→
KartikSharma4448KartikSharma4448

branding-generator

Interview clients, research markets, and generate three brand directions with visual assets.

Community
Advanced
HerxinsasaHerxinsasa
1

ckm:banner-design

Creates platform-optimized banner designs with exact dimension compliance and high-resolution PNG export.

Community
Advanced
jtvarisjtvaris

ckm:banner-design

Automate banner design with HTML/CSS creation and asset export pipelines.

Community
Advanced
HarshodaiHarshodai

banner-design

Generate multi-format creative banners for social media, advertising, and web hero sections.

Community
Advanced