Menü
将结构化信息（GitHub 库介绍、文章总结、产品简介等）渲染成飞书风格的卡片图片，输出高分辨率 PNG，可直接发送给用户。
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
Content caster (铸). Transforms content into PNG visuals. Seven molds: -l (default) long reading card, -i infograph, -m multi-card reading cards (1080x1440), -v editorial sketchnote (problem→failure→pivot→insight→naming, magazine + archive layout), -c comic (manga-style B&W), -w whiteboard (marker-style board layout), -b big-fonts attachment card (1080x1440, weathered 碑刻 style for 小红书). Output to ~/Downloads/. Use when user says '铸', 'cast', '做成图', '做成卡片', '做成信息图', '做成海报', '视觉笔记', 'sketchnote', '杂志', 'editorial', '漫画', 'comic', 'manga', '白板', 'whiteboard', '大字', '附件图', 'big fonts', '小红书卡片'. Replaces ljg-cards and ljg-infograph.
将结构化信息（GitHub 库介绍、文章总结、产品简介等）渲染成飞书风格的卡片图片，输出高分辨率 PNG，可直接发送给用户。
| name | feishu-card |
| description | 将结构化信息（GitHub 库介绍、文章总结、产品简介等）渲染成飞书风格的卡片图片，输出高分辨率 PNG，可直接发送给用户。 |
| triggers | ["帮我做成卡片图片","飞书风格卡片","生成信息卡片图片","做成图片发给我"] |
| tools | ["write_file","terminal","browser_navigate","browser_vision"] |
把结构化内容（GitHub 库介绍、文章总结、项目报告等）渲染为飞书风格的卡片 PNG 图片。 技术栈：纯 HTML + CSS → Puppeteer 截图（2x 高清），无需外部图片服务。
将信息归纳为以下区块（按需取舍）：
保存到 /tmp/<name>_card.html，使用下方 CSS 设计系统：
核心设计 Token：
/* 主色 */
--blue-primary: #1456F0;
--blue-light: #f0f5ff;
--blue-border: #d0e1fd;
/* 背景层次 */
--bg-card: #ffffff;
--bg-section: #f7f8fc;
--bg-page: #f0f2f5;
/* 文字 */
--text-primary: #222;
--text-secondary: #333;
--text-muted: #888;
/* 代码块（Catppuccin Mocha） */
--code-bg: #1e1e2e;
--kw: #cba6f7; /* keyword - 紫 */
--fn: #89b4fa; /* function - 蓝 */
--st: #a6e3a1; /* string - 绿 */
--cm: #6c7086; /* comment - 灰 */
--nu: #fab387; /* number - 橙 */
--ty: #f9e2af; /* type - 黄 */
关键组件样式：
/* 卡片容器 */
.card {
background: #fff;
border-radius: 12px;
width: 600px;
box-shadow: 0 2px 12px rgba(0,0,0,0.10);
overflow: hidden;
}
/* 蓝色渐变 Header */
.card-header {
background: linear-gradient(135deg, #1456F0 0%, #1890FF 100%);
padding: 22px 24px 20px;
display: flex; align-items: center; gap: 14px;
}
/* Section 标题（带分割线） */
.section-title {
font-size: 13px; font-weight: 700;
color: #1456F0; letter-spacing: 0.5px; text-transform: uppercase;
margin-bottom: 10px; display: flex; align-items: center; gap: 6px;
}
.section-title::after {
content: ''; flex: 1; height: 1px; background: #e8edf5;
}
/* 描述块（蓝色左边框） */
.desc-block {
background: #f7f8fc;
border-left: 3px solid #1456F0;
border-radius: 0 8px 8px 0;
padding: 12px 14px;
font-size: 13.5px; color: #333; line-height: 1.75;
}
/* Stats 徽章 */
.stat-badge {
display: flex; align-items: center; gap: 5px;
background: #f0f5ff; border: 1px solid #d0e1fd;
border-radius: 20px; padding: 4px 12px;
font-size: 12.5px; color: #2b4ea8; font-weight: 500;
}
/* 绿色变体 */ .stat-badge.green { background:#f0faf4; border-color:#b7e5c8; color:#1a7a40; }
/* 橙色变体 */ .stat-badge.orange { background:#fff8f0; border-color:#ffd6a0; color:#b05f00; }
/* 安装命令行 */
.install-block {
background: #0d1117; border-radius: 8px;
padding: 12px 16px; display: flex; align-items: center; gap: 10px;
}
/* 双列功能网格 */
.feature-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.feature-item {
display: flex; align-items: flex-start; gap: 8px;
background: #f7f8fc; border-radius: 8px;
padding: 10px 12px; border: 1px solid #eaecf3;
}
/* Footer */
.card-footer {
background: #f7f8fc; border-top: 1px solid #eaecf3;
padding: 12px 24px;
display: flex; align-items: center; justify-content: space-between;
}
保存到 /tmp/screenshot_card.js：
const puppeteer = require('/opt/homebrew/lib/node_modules/puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: 'new',
args: ['--no-sandbox', '--disable-setuid-sandbox']
});
const page = await browser.newPage();
const filePath = 'file:///tmp/<name>_card.html'; // ← 替换文件名
await page.goto(filePath, { waitUntil: 'networkidle0' });
// 获取卡片尺寸，设置精确 viewport
const dim = await page.evaluate(() => {
const r = document.querySelector('.card').getBoundingClientRect();
return { width: r.width, height: r.height };
});
await page.setViewport({
width: Math.ceil(dim.width) + 64,
height: Math.ceil(dim.height) + 64,
deviceScaleFactor: 2 // 2x 高清
});
// 重新加载以应用 viewport
await page.goto(filePath, { waitUntil: 'networkidle0' });
const card = await page.$('.card');
await card.screenshot({ path: '/tmp/<name>_card.png' }); // ← 替换文件名
console.log('Done: /tmp/<name>_card.png');
await browser.close();
})();
运行：
node /tmp/screenshot_card.js
用 MEDIA:/tmp/<name>_card.png 发送给用户。
/opt/homebrew/lib/node_modules/puppeteer（macOS Homebrew 安装）-apple-system, "PingFang SC" 自动支持中文，无需额外安装<span class="kw/fn/st/cm"> 手动标注，无需引入 highlight.js.blue（默认）/ .green / .orange 三种<table>）+ Footer