skills.rest
Ramadan-Elgamal
Ramadan-ElgamalCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

banner-design

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

Updated Aug 7, 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/Ramadan-Elgamal/Autobees --skill banner-design-ramadan-elgamal
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: banner-design
Source: https://github.com/Ramadan-Elgamal/Autobees/tree/main/.agents/skills/banner-design
Command: npx skills add https://github.com/Ramadan-Elgamal/Autobees --skill banner-design-ramadan-elgamal

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Creating banners across many platforms requires knowing dozens of size specs, safe zones, and art direction styles, and producing multiple design variants manually is slow and inconsistent. ## 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 formats. - Multiple Art Direction Options: Generates several style variants per request from 22 documented styles including minimalist, gradient, glassmorphism, neon, and editorial. - AI Visual Generation and Export: Creates background and hero imagery via Gemini image models, composes text and CTA overlays in HTML/CSS, and exports final PNGs via headless Chrome screenshots. - Use Case: A marketer needs a Twitter/X header and an Instagram story for a product launch; the skill gathers requirements, researches Pinterest references, generates three styled options per size, and exports ready-to-use PNG files. ## 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 quantity when prompted, and the skill generates each banner at the exact platform dimensions from its size reference. It produces multiple art direction variants per size and exports them as PNG files organized by campaign folder.

What banner sizes does this skill support?▼

It covers Facebook covers, Twitter/X headers, LinkedIn banners, YouTube channel art, Instagram posts and stories, Google Display ad units, website heroes, email headers, and print formats like roll-ups. Full dimensions are listed in the banner-sizes-and-styles reference file.

Which AI image model should I use for banner backgrounds?▼

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 I use my own brand guidelines in generated banners?▼

Yes, the workflow checks for a docs/brand-guidelines.md file and injects brand context into each HTML/CSS banner via the inject-brand-context script. This keeps colors, fonts, and logo placement consistent with your brand.

What are the limitations of this banner design skill?▼

It handles static banner design only and does not cover video editing, full website design, or print production management. Text is overlaid in HTML rather than generated inside images, and print output requires manual CMYK and bleed verification.

Related Skills

Explore More Design & Creative Skills→
gzyxdsgzyxds

banner-design

Generate multi-format banners from a brand brief with art-direction rules.

Community
Intermediate
4asaanAI4asaanAI

ckm:banner-design

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

Community
Advanced
DebindennyDebindenny

ckm:banner-design

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

Community
Advanced
ceslepceslep

ckm:banner-design

Generate creative banner designs for specified platforms, styles, and dimensions.

Community
Advanced