IO

irinabuht12-oss/email-campaigns-claude

Developer tools

Эта страница переведена автоматически. Технические детали смотрите в оригинале. Открыть оригинал

161 stars Качество 61 Тренд 24MIT

irinabuht12-oss / email-campaigns-claude - кандидат на агентские навыки, импортированный из https://github.com/irinabuht12-oss/email-campaigns-claude.

Обзор

irinabuht12-oss / email-campaigns-claude - кандидат на агентские навыки, импортированный из https://github.com/irinabuht12-oss/email-campaigns-claude.

Обзор (машинный перевод)

Прекрасные кампании по электронной почте HTML с Resend и Claude Code.

Навык Claude Code, который кодирует полный шаблон для создания и отправки современных маркетинговых писем — хостинг активов, многоразовые дизайнерские блоки (карты из морозного стекла, видеоблоки с размытым фоном, кнопки CTA), оптимизация GIF и конвейер отправки Resend.

Что внутри

SKILL.md — полное мастерство, перейдите в ~/.claude/skills/email-campaigns/ и вызовите /email-campaigns примеры/claude-connector.html — реальная производственная электронная почта, построенная по этой схеме. Откройте в браузере, чтобы увидеть полученный результат.

##Установка как навык кода Клода

Затем в любом сеансе кода Клода: /email-campaigns

Чему вы научитесь

Хостинг актива — превратите свою собственную папку Vercel/Netlify public/ в бесплатную электронную почту CDN (без облачного счета) Система дизайна — блоки копирования пасты: изображение героя, эмблемы из морозного стекла, миниатюры видео с размытым цветовым фоном, темные кнопки CTA

  • GIF pipeline - ffmpeg one-liners для преобразования записей экрана MP4 в безопасные GIF-файлы (менее 2 МБ, 15 кадров в секунду, чувственно обрезанные) Интеграция отправки — одноотправная, пакетная, капельная последовательности с webhooks

Эта страница переведена автоматически. Технические детали смотрите в оригинале.

README

email-campaigns-claude

Beautiful HTML email campaigns with Resend and Claude Code.

A Claude Code skill that encodes a complete pattern for building and sending modern marketing emails — asset hosting, reusable design blocks (frost-glass cards, video blocks with blurred backgrounds, CTA buttons), GIF optimization, and the Resend send pipeline.

What’s inside

  • SKILL.md — the full skill, drop into ~/.claude/skills/email-campaigns/ and invoke via /email-campaigns
  • examples/claude-connector.html — real production email built with this pattern. Open in a browser to see the rendered result.

Install as a Claude Code skill

# Clone
git clone https://github.com/irinabuht12-oss/email-campaigns-claude.git

# Install as a skill
mkdir -p ~/.claude/skills/email-campaigns
cp email-campaigns-claude/SKILL.md ~/.claude/skills/email-campaigns/SKILL.md

Then in any Claude Code session: /email-campaigns

What you’ll learn

  • Asset hosting — turn your own Vercel/Netlify public/ folder into a free email CDN (no Cloudinary bill)
  • Design system — copy-paste blocks: hero image, frost-glass logo cards, video thumbnails with blurred color backgrounds, dark CTA buttons
  • GIF pipeline — ffmpeg one-liners to convert MP4 screen recordings into email-safe GIFs (under 2 MB, 15fps, sensibly trimmed)
  • Resend integration — single-send, batch-send, drip sequences with webhooks
  • Pre-send checklist — absolute URLs, preheader, alt text, client testing

Design tokens at a glance

Element Value
Card corner radius 3px
Card shadow 0 2px 8px rgba(24,24,27,.06), 0 8px 24px rgba(24,24,27,.04)
Typography scale 26px / 15px / 13px
Max card width 560px
Primary action Black pill CTA, repeated 2x
Background Soft sky-blue gradient + 6% SVG noise texture

Example

The examples/ folder has a complete real-world email (the Ryze AI × Claude Connector launch) showing every block used in context.

Open examples/claude-connector.html in any browser for the live preview.

Pull the numbers for the email from your ad accounts

The example campaign in examples/ announces the Ryze connector. If you want Claude to read your own Google Ads, Meta Ads, GA4 or Search Console data while it writes (results, winners, the stat for the hero), add the free Ryze MCP once:

claude mcp add ryze --transport http https://connector.get-ryze.ai/mcp

In claude.ai, Claude Desktop or Cursor: Settings › Connectors › Add custom connector, paste https://connector.get-ryze.ai/mcp. Setup guide → · 48 more Claude marketing skills →

License

MIT

Открыть полный README на GitHub

Рекомендуемые инструменты

Попробуйте другой запрос или уберите фильтр.

Установка

npx skillfish add irinabuht12-oss/email-campaigns-claude
Новичок в MCP? Начните с руководства на mcpskill.org →