Blog Post Image Generator

Here’s how your guide would look on the frontend when rendered:

A Quick Guide for the LowCode Agency Content Team on Creating Blog Post Covers

Getting Started

1. Access the Tool

Go to: https://blog-cover-generator-seven.vercel.app

2. Sign In

Click “Sign in with Google” and use your @lowcode.agency Google account.

Only team members with @lowcode.agency emails can access the tool.

Creating a Cover

Step 1: Enter Your Text

Field	Description	Example
Header	The main blog title (max 100 chars)	“Building Scalable APIs”
Subheader	A supporting tagline (max 150 chars)	“A complete guide to REST and GraphQL”
Keywords	Optional, comma-separated topics	“api, automation, integration”

Tips for text:

Keep headers punchy and scannable
Subheaders should expand on the header’s promise
Keywords help the AI generate relevant visuals

Step 2: Choose a Background

Click one of three background options:

Option	Best For
Purple	Default brand look, works for most topics
Black	Technical deep-dives, developer content
Off-white	Lighter topics, guides, tutorials

Step 3: Generate

Click “Generate Cover” and wait for the AI to create your image.

Generation takes 5-15 seconds depending on complexity.

Step 4: Download

Choose your format:
- WebP (recommended) - Smaller file size, modern format
- PNG - Universal compatibility
Click “Download”

The file will be named after your header text (e.g., building-scalable-apis.webp).

Output Specifications

Property	Value
Dimensions	900 x 471 pixels
Aspect Ratio	~1.91:1 (optimized for social sharing)
Format	WebP (primary) or PNG
Text Position	Left side (~50% of image)
Logo	Bottom-right corner

Best Practices

Writing Effective Headers

Do:

“5 Ways to Automate Your Workflow”
“The Future of No-Code Development”
“Why APIs Matter for Modern Business”

Don’t:

“Blog Post About Automation” (too generic)
“Everything You Need to Know About Every API Ever Made” (too long)

Choosing Keywords

Keywords guide the AI’s visual style. Use relevant technology or topic terms:

Topic	Good Keywords
Automation	automation, workflow, integration, zapier
AI/ML	ai, machine learning, neural network, gpt
Development	code, api, developer, programming
Business	business, enterprise, startup, growth
Web	web, frontend, react, design

When to Regenerate

Not happy with the result? Just click “Generate Cover” again. Each generation is unique, so you’ll get different visuals.

Troubleshooting

“Generation Failed”

Check your internet connection
Try again in a few seconds
If persistent, contact the dev team

Text looks cut off

Shorten your header or subheader
Headers wrap automatically, but very long text may not fit well

Wrong logo color

The tool automatically selects:

White logo → Purple or Black backgrounds
Color logo → Off-white background

This is by design for optimal contrast.

Quick Reference

Header:     Your main title (required)
Subheader:  Supporting text (required)
Keywords:   Topic hints for AI (optional)
Background: Purple / Black / Off-white
 
Output:     900x471px WebP or PNG

This layout offers a clear structure with headings, tables, lists, and instructions formatted to be easy to follow. You can now easily guide the team in creating blog post covers!