Article Cover Image
Makes a header image for your article in a palette and drawing style you choose
by Jim Liu
Banner Designer
by Next Level BuilderSkillMake visuals
Designs banners for social media, ads, website headers and print in several styles
The problem it solves
Your event is next week, and you need matching headers for X, LinkedIn and YouTube, each in a different size.
For MarketersContent creatorsSmall business owners
- Before
- You resize one design for every platform by hand, or wait for a designer to make each version.
- After
- Your agent proposes two or three art directions, builds each banner at the exact size, and exports PNG files when a browser tool is available.
- Stars
- ★ 143k
- License
- MIT
- Cost
- Free
- Level
- Intermediate
- Contents
- Instructions only
Overview
This skill guides your AI agent through designing banners. It asks about purpose, platform, text, brand and style, proposes two or three art directions, builds each option in HTML and CSS at the exact platform size, and exports PNG images when a browser or screenshot tool is available. It includes sizes and crop margins for Facebook, X, LinkedIn, YouTube, Instagram, Google Ads, website heroes and print, plus 22 styles. It suits marketers, creators and small businesses who need covers and ad banners.
It builds banners as editable HTML and CSS at exact platform sizes, so the text stays sharp and easy to change before export.
Try these first
Start with the first one: it is a small task you can check easily.
- Design one 1500x500 header for X announcing [event name] in a minimalist style. Show me the preview before exporting.First try · small first task
- Which banner styles would suit a craft bakery? Suggest two and explain why.
- Make three options for a LinkedIn cover for a [job title], using my colors [colors] and logo [file].
- Export the chosen design as PNG files for X, LinkedIn and Facebook covers.writes files
Example prompts written by Agent Flows Hub.
What you get
From the creator's documentation.
| Output | What it is | Reads |
|---|---|---|
| Requirements check | Asks about purpose, platform, text, brand and style before designing | Your answers |
| Art directions | Two or three style options, drawn from 22 styles in the bundled guide | Built-in guide |
| Platform sizes | Exact sizes and crop margins for social covers, ads, website heroes and print | Built-in guide |
| HTML banners | Each option built in HTML and CSS with your logo, colors and text | Your files |
| PNG export | Captures each banner as a PNG when a browser or screenshot tool is available | Your agent's tools |
Good to know
You need a cover or ad banner in a specific platform size. The skill collects your text and brand details, builds options in HTML and CSS, and exports PNG files you can upload.
Limits
- PNG export needs a browser or screenshot tool in your agent; without one you get the HTML and CSS, with the export marked as pending.
- It only applies brand colors, fonts and logos you supply, so have them ready.
Notes by Agent Flows Hub (original project name: banner-design), written from the creator's documentation, not from running it ourselves. banner-design SKILL.md
Stuck setting it up?
Tell us what happened. We take a look first; if it needs paid work, you get an estimate before anything starts.
More to make visuals
Other skills
- Better Interface Looks over the screens of an app you are building and returns one ranked list of fixes
- Cash Flow Forecast Turns your income and expense records into a 30, 60 and 90-day cash forecast
- Caveman Makes your AI agent put the answer first and drop filler, with code and facts kept exact
- Charlie AI CFO CFO-style thinking on cash, runway and hiring for self-funded founders
- Company Research Report Writes a full value-investing report on one listed company from four investors' views
- Competitor Ad Teardown Breaks down a competitor's public ads into hooks, offers, calls to action and test ideas