| name | awesome-marketing-skills-library |
| description | AI agent skill library for generating premium marketing materials with aesthetic-first design using Sacred Drift principles |
| triggers | ["create a premium brochure using awesome marketing skills","generate a luxury marketing brochure with sacred drift aesthetic","use the brochure generator skill for this marketing campaign","design a high-fidelity marketing material with vibe design principles","make a WCAG compliant brochure for this product launch","build a premium PDF brochure with mathematical typography","create marketing collateral using the awesome marketing skills library","generate a mobile-optimized marketing brochure with research automation"] |
Awesome Marketing Skills Library
Skill by ara.so — Marketing Skills collection.
A universal, high-fidelity library of AI Agent skills for generating premium marketing materials. This library follows the "Vibe Designing" philosophy using Sacred Drift aesthetics, mathematical precision, and contextual intelligence to create pixel-perfect marketing collateral.
What It Does
Awesome Marketing Skills provides reusable skill modules that AI coding agents can execute to:
- Generate premium multi-page marketing brochures (PDF) with 1:1 aspect ratio
- Apply Sacred Drift design archetype (Cormorant Garamond + Jost typography)
- Ensure WCAG AAA compliance programmatically
- Automate research using Tavily and Firecrawl MCP servers
- Export high-resolution PDFs via Puppeteer automation
- Create contextually accurate marketing copy with local cultural awareness
Installation
Clone into your project's .agents/skills/ directory:
mkdir -p .agents/skills
cd .agents/skills
git clone https://github.com/plushyta/Awesome-Marketing-Skills.git awesome-marketing-skills
MCP Server Requirements
The skills require these Model Context Protocol servers:
{
"mcpServers": {
"tavily": {
"command": "uvx",
"args": ["mcp-server-tavily"],
"env": { "TAVILY_API_KEY": "<YOUR_TAVILY_API_KEY>" }
},
"firecrawl": {
"command": "uvx",
"args": ["firecrawl-mcp"],
"env": { "FIRECRAWL_API_KEY": "<YOUR_FIRECRAWL_API_KEY>" }
},
"stock-images": {
"command": "uvx",
"args":
Add this to your mcp_config.json or IDE-specific MCP configuration file.
Active Skills
Brochure Generator
Located at: .agents/skills/awesome-marketing-skills/.agents/skills/brochure-generator/
The flagship skill for creating premium marketing brochures.
Triggering the Skill:
Simply describe what you want in natural language:
"Create a premium 5-page brochure for a luxury yoga retreat in Rishikesh using the Sacred Drift theme"
"Design a high-end PDF brochure for my tech conference with WCAG AAA compliance"
Key Features:
- Sacred Drift typography (Cormorant Garamond + Jost)
- Automated research via MCP servers
- WCAG AAA contrast checking
- Mobile-optimized layouts (1:1 aspect)
- Puppeteer PDF export
Code Examples
Basic HTML Structure (Sacred Drift Pattern)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;600&family=Jost:wght@300;400;500&display=swap" rel="stylesheet">
<style>
:root {
--font-serif: 'Cormorant Garamond', serif;
--font-sans: 'Jost', sans-serif;
--color-primary: #2C1810;
--color-accent: #D4A574;
--color-bg: #FAF8F3;
}
body {
font-family: var(--font-sans);
background: var(--color-bg);
color: var(--color-primary);
line-height: 1.75;
: ;
: ;
}
, , {
: (--font-serif);
: ;
: ;
}
{
: ;
: ;
: relative;
: hidden;
: always;
}
Sacred Drift Brochure
WCAG Contrast Checker (JavaScript)
function getContrastRatio(color1, color2) {
const getLuminance = (color) => {
const rgb = color.match(/\d+/g).map(Number);
const [r, g, b] = rgb.map(val => {
val = val / 255;
return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
});
return 0.2126 * r + 0.7152 * g + 0.0722 * b;
};
const lum1 = getLuminance(color1);
const lum2 = getLuminance(color2);
const brightest = Math.max(lum1, lum2);
const darkest = Math.min(lum1, lum2);
return (brightest + 0.05) / (darkest + 0.05);
}
const ratio = getContrastRatio('rgb(44, 24, 16)', 'rgb(250, 248, 243)');
if (ratio >= ) {
.();
} {
.(, ratio);
}
Puppeteer PDF Export
const puppeteer = require('puppeteer');
async function exportBrochureToPDF(htmlPath, outputPath) {
const browser = await puppeteer.launch({
headless: true,
args: ['--no-sandbox', '--disable-setuid-sandbox']
});
const page = await browser.newPage();
await page.setViewport({ width: 1080, height: 1080 });
await page.goto(`file://${htmlPath}`, { waitUntil: 'networkidle0' });
await page.pdf({
path: outputPath,
format: 'A4',
printBackground: true,
preferCSSPageSize: true,
margin: { top: 0, right: 0, bottom: 0, left: 0 }
});
await browser.close();
console.log();
}
(
,
);
MCP Server Integration Pattern
async function researchLocation(location) {
const query = `cultural significance and attractions of ${location}`;
const results = await tavily.search({
query: query,
search_depth: 'advanced',
max_results: 5
});
return results;
}
async function fetchContextualImage(theme, orientation = 'landscape') {
const results = await stockImages.search({
query: theme,
orientation: orientation,
size: 'large',
per_page: 3
});
return results[0].src.large2x;
}
Configuration
IDE-Specific Setup
Claude Code / Cursor / Windsurf:
The agent automatically discovers skills in .agents/skills/. No additional configuration needed.
GitHub Copilot:
Add to .github/copilot-instructions.md:
## Custom Skills
Check `.agents/skills/awesome-marketing-skills/` for marketing design skills.
Use Sacred Drift aesthetic principles for all brochure generation tasks.
Codex CLI:
codex run .agents/skills/awesome-marketing-skills/.agents/skills/brochure-generator
Common Patterns
Sacred Drift Color Palette
:root {
--sacred-drift-charcoal: #2C1810;
--sacred-drift-cream: #FAF8F3;
--sacred-drift-gold: #D4A574;
--sacred-drift-sage: #9CAA9C;
--overlay-dark: linear-gradient(135deg, rgba(44,24,16,0.85), rgba(44,24,16,0.65));
--overlay-light: linear-gradient(135deg, rgba(250,248,243,0.95), rgba(250,248,243,0.85));
}
Vertical Rhythm System
.rhythm-small { line-height: 1.5; }
.rhythm-medium { line-height: 1.75; }
.rhythm-large { line-height: 2.0; }
.spacing-xs { margin-bottom: 8px; }
.spacing-sm { margin-bottom: 16px; }
.spacing-md { margin-bottom: 24px; }
.spacing-lg { margin-bottom: 40px; }
.spacing-xl { margin-bottom: 64px; }
Troubleshooting
MCP Servers Not Found
Error: MCP server 'tavily' not configured
Solution:
uvx mcp-server-tavily
uvx firecrawl-mcp
uvx stock-images-mcp
echo $TAVILY_API_KEY
echo $FIRECRAWL_API_KEY
echo $PEXELS_API_KEY
PDF Export Issues
Error: Failed to launch browser
Solution:
sudo apt-get install -y chromium-browser
const browser = await puppeteer.launch({
executablePath: '/usr/bin/google-chrome',
headless: true
});
Font Loading Failures
Error: Google Fonts not loading in PDF
Solution:
await page.goto(htmlPath, { waitUntil: 'networkidle0' });
await page.evaluateHandle('document.fonts.ready');
await page.waitForTimeout(1000);
WCAG Compliance Failures
Error: Contrast ratio below 7:1
Solution:
const improveContrast = (textColor, bgColor) => {
let ratio = getContrastRatio(textColor, bgColor);
while (ratio < 7) {
textColor = darkenColor(textColor, 0.05);
ratio = getContrastRatio(textColor, bgColor);
}
return textColor;
};
Directory Structure
.agents/skills/awesome-marketing-skills/
├── .agents/skills/
│ └── brochure-generator/
│ ├── SKILL.md # Skill instructions
│ ├── templates/ # HTML/CSS templates
│ └── examples/ # Example outputs
├── image.png # Banner
├── README.md # Main documentation
└── LICENSE
Contributing New Skills
To add a new skill to this library:
- Create a new directory in
.agents/skills/
- Add a
SKILL.md with frontmatter (name, description, triggers)
- Include example code and templates
- Update main README.md with skill entry
- Follow Sacred Drift design principles
Example Workflow
async function generatePremiumBrochure(config) {
const { title, theme, location, pages } = config;
const research = await researchLocation(location);
const heroImage = await fetchContextualImage(theme);
const html = generateBrochureHTML({
title,
research,
heroImage,
pages,
typography: 'sacred-drift',
palette: 'warm-earth'
});
const isCompliant = validateWCAG(html);
if (!isCompliant) throw new Error('Contrast compliance failed');
await exportBrochureToPDF(html, `./output/${title}.pdf`);
return { success: true, path: `./output/${title}.pdf` };
}
await generatePremiumBrochure({
title: 'Yog Yatra Retreat',
theme: ,
: ,
:
});
