Generate marketing content from PolicyEngine blog posts - social media images, social post copy, and branded assets
From essentialnpx claudepluginhub policyengine/policyengine-claude --plugin data-scienceThis skill uses the workspace's default tool permissions.
templates/social-image.htmlGuides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.
Use this skill when generating marketing content from PolicyEngine blog posts, research, or announcements. This includes social media images and social post copy.
This skill provides templates and patterns for generating consistent, branded PolicyEngine content across multiple channels and audiences (UK, US, global).
1200x630 PNG images for LinkedIn, X (Twitter), and Facebook with:
Newsletter generation is planned for a future release. The agent can generate newsletter HTML ad-hoc following brand guidelines, but there is no template file yet.
Platform-optimized text for:
Content is localized for different audiences:
| Aspect | UK | US |
|---|---|---|
| Spelling | modelling, centre | modeling, center |
| References | 10 Downing Street | UK Prime Minister's office |
| Context | Direct announcement | "Same tech that powers PolicyEngine US" |
| Flags | 🇬🇧 | 🇺🇸 🇬🇧 |
| Sections | No NSF mention | Include NSF/POSE if relevant |
headline: Main headline text
headline_highlight: Text to highlight in teal (optional)
subtext: Supporting description
flags: Emoji flags to display (e.g., "🇬🇧" or "🇺🇸 🇬🇧")
headshot_url: URL or path to headshot image
quote: Pull quote text
attribution_name: Quote attribution name
attribution_title: Quote attribution title/role
logo_path: Path to PolicyEngine logo
Source of truth: policyengine-design-skill and @policyengine/design-system CSS tokens.
Social image generation runs in headless Chrome with design tokens loaded, so use CSS vars where possible. Fallback hex values for non-browser contexts:
| Token | CSS var | Hex |
|---|---|---|
| Primary teal | --pe-color-primary-500 | #319795 |
| Light teal | --pe-color-primary-200 | #81E6D9 |
| Dark background | (custom) | #1a2332 |
| Text gray | --pe-color-gray-400 | #9CA3AF |
| White | --pe-color-bg-primary | #FFFFFF |