skills.rest
MANR255926
MANR255926COMMUNITY
Explore all skills by this author →
𝕏@Allyan255926GitHub

banner-design

Generates multi-format banner designs with AI visuals and exports them to PNG at platform dimensions.

Updated Aug 31, 2026
Search Tags:#social media#image generation#art direction#png export#html css#banner design#display ads
One-click install
npx skills add https://github.com/MANR255926/GARAGE --skill banner-design-manr255926
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: banner-design
Source: https://github.com/MANR255926/GARAGE/tree/main/.agents/skills/banner-design
Command: npx skills add https://github.com/MANR255926/GARAGE --skill banner-design-manr255926

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Creating banners for social media covers, display ads, website heroes, and print requires knowing dozens of platform dimensions, safe zones, and art direction styles, then producing multiple design variants manually. ## Core Features & Use Cases - Multi-Platform Sizing: Covers Facebook, Twitter/X, LinkedIn, YouTube, Instagram, Google Display ads, website heroes, and print formats with exact pixel dimensions and safe-zone rules. - Multiple Art Direction Options: Generates several design variants per request from 22 documented styles including minimalist, gradient, glassmorphism, neon, and editorial. - AI Visual Generation & Export: Creates background and hero visuals via Gemini image models, composes text and CTA overlays in HTML/CSS, and exports final banners to PNG via headless Chrome screenshots. - Use Case: A marketer needs a Twitter/X header and an Instagram story for a product launch; the skill researches references, produces three styled variants per size, and exports ready-to-upload PNGs. ## Quick Start Ask the AI to design three minimalist banner options for a Twitter/X header at 1500x500 pixels with your headline and brand colors.

Frequently Asked Questions about banner-design

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

FAQPage Schema
How do I design a banner for social media with correct dimensions?▼

Specify the platform and the skill applies exact dimensions from its size reference, such as 1500x500 for Twitter/X headers or 1080x1920 for Instagram stories. It keeps critical content within the central 70-80% safe zone and exports the final PNG at the exact size.

What banner sizes does Google Display Network require?▼

Common Google Display sizes include 300x250 medium rectangle, 728x90 leaderboard, 300x600 half page, and 320x50 mobile banner. The reference file lists all supported sizes with notes on performance, such as the medium rectangle having the highest CTR.

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.

Can this skill handle video editing or full website design?▼

No, the skill explicitly handles banner design only and refuses out-of-scope requests. It does not perform video editing, full website design, or print production work.

What design rules apply to text on ad banners?▼

Ads should keep text under 20% of the canvas since Meta penalizes heavy text. Use a maximum of two typefaces, minimum 16px body text, at least 32px headlines, and a 4.5:1 contrast ratio with one CTA per banner.

Related Skills

Explore More Design & Creative Skills→
clovernguyen1010-ship-itclovernguyen1010-ship-it

ba-brand-info-extract

Collect brand assets including name, tagline, personality, audience, and platforms.

Community
Intermediate
4asaanAI4asaanAI

ckm:banner-design

Design multi-platform banners with exact dimensions and export PNGs.

Community
Advanced
s0nbuildtech287s0nbuildtech287

banner-design

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

Community
Advanced
Thanh-aperoThanh-apero
1

ckm:design

Generate logos, corporate identity programs, mockups, and social media images.

Community
Advanced