card-quote

card-quote is a skill for Claude Code, Codex from ZJU-REAL/Easel. It costs 81 tokens per session (962 once invoked), scanned A, original, Apache-2.0.

A tool for making wide 16:9 quote cards or data cards for platforms such as Weibo, Zhihu, public-account articles, and X/Twitter.

In plain words
What is it for?
Use it to create quote cards with an attribution, or data cards with one main figure and two to four supporting figures.
Why use it?
It turns one key statement or a small set of figures into a structured image that is easier to share. It also specifies suitable text hierarchy and source details.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

Needs its repository: it reads a path above its own folder, which exists only inside the repository. The line is ⚠️ **生成前先读 [card-design](../card-design/SKILL.md) 设计系统**(选立场/锁配色/字越大越细/禁 AI 廉价感)。金句卡尤其靠排版层级——避免渐变文字、粗黑大标题、居中一切。.

Good fit Use it to create quote cards with an attribution, or data cards with one main figure and two to four supporting figures.

Compare 6 skills from other repositories ↓
Install

Getting it into your agent

It runs from inside its repository, so the clone comes first — what it calls does not travel with the file alone.

Clone the repo
git clone --depth 1 https://github.com/ZJU-REAL/Easel
agentmods
npx agentmods add skills/zju-real/easel/card-quote

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for card-quote

README.md
[![agentmods](https://agentmods.dev/badge/skills/zju-real/easel/card-quote/github.svg)](https://agentmods.dev/skills/zju-real/easel/card-quote)
Your own site
<a href="https://agentmods.dev/skills/zju-real/easel/card-quote"><img src="https://agentmods.dev/badge/skills/zju-real/easel/card-quote/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for card-quote

Your own site · 80×15
<a href="https://agentmods.dev/skills/zju-real/easel/card-quote"><img src="https://agentmods.dev/badge/skills/zju-real/easel/card-quote.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 81 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 962 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • NVIDIA SkillSpector pass 7 Sept 2026
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00081 $0.00962
Opus 5 $0.00041 $0.00481
Sonnet 5 $0.00016 $0.00192
Haiku 4.5 $0.00008 $0.00096

Measured 10d ago against content hash 0d251a308c28, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-10, from the pricing page.

Security

Grade A, and why

card-quote scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/openclaw/card-quote/SKILL.md · 61 lines

What it actually says

金句卡片

HTML 单图渲染 → 截图分享。16:9 横版,一句 hero 金句 / 一组核心数据。

⚠️ 生成前先读 card-design 设计系统(选立场/锁配色/字越大越细/禁 AI 廉价感)。金句卡尤其靠排版层级——避免渐变文字、粗黑大标题、居中一切。

骨架(二选一,按内容是"观点"还是"数字")

先按 card-design 选风格锁配色,再套下面对应骨架。

A. 金句卡(一句 hero 观点)

  • 容器 w-[1600px] h-[900px],暗色 / 亮色按内容情绪二选一。
  • 中央一句 hero 金句(字越大越细,限 2-3 行,最戳的词用 1 个强调色)。
  • 下方署名 / 出处(无个人 handle 时用来源或品牌名,不硬塞头像占位)。
  • 左上角小标签(Insight / 观点 / Quote);右下角品牌水印。
  • 微妙纹理(grid / dot / 极淡 noise),禁玻璃拟态与渐变文字。

B. 数据卡(一组核心数字)

  • 同画幅,1 个主数字超大字(占视觉中心)+ 单位/说明小字在旁。
  • 2-4 个副指标横向排开,每个「大数字 + 一行标签」,对齐到网格。
  • 可加一句结论/来源脚注(数据来源 · 截至 X)建立可信度。
  • 数字用等宽或 Inter Tight,避免用 emoji 当图标。

国内平台适配

  • 微博:横版直接配文;金句要短、能被单独转发;水印放品牌名。
  • 知乎:偏理性,数据卡 + 一句结论最合适;出处/来源要显。
  • 公众号:可作文中配图或封面延展;配色跟公众号主色。
  • X/Twitter(出海):可保留 handle 署名;其余同金句卡。

渲染出图(必做,勿手动截图)

生成 HTML 后,用共享渲染脚本自动出图(playwright + chromium,已配置走代理加载 CDN/字体):

python skills/shared/scripts/render_card.py \
  --html outputs/主题名/assets/card.html \
  --out outputs/主题名/card.png \
  --full-page --width 1600 --height 900
  • 16:9 横版用 --width 1600 --height 900
  • 脚本对外部 CDN/字体做有界超时(默认 20s 超时也继续),不会卡死;用环境代理加载 Tailwind/Google Fonts。
  • 首次使用需 pip install playwright && playwright install chromium(见项目依赖说明)。

与其他卡片 SKILL 的区别

三者都是"HTML 单图 → 截图",仅画幅与场景不同,互不替代:

  • card-quote(本 SKILL) = 16:9 横版金句/数据卡,一句 hero 观点或一组核心数字,配微博 / 知乎 / X / 公众号。
  • card-xiaohongshu = 1080×1440 竖版小红书知识卡(走 card-design 风格库),可多张联排滑动浏览。承载多观点、成套干货时用它。
  • poster-hero = 1080×1920 竖版营销海报 / 朋友圈分享图,大标题 + 卖点 + 二维码,用于产品发布、活动宣传。
Files

What ships with it

3 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 10d ago First seen · 61 lines · 81 tokens per session scan A 0d251a308c28

Subscribe to this mod's changes

card-quote is a skill published in the GitHub repository ZJU-REAL/Easel (710 stars, last pushed yesterday), licensed Apache-2.0. It adds 81 tokens to every session and 962 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

ppt-generation

Generate PPTX presentations from slide plan + content.

HezaoHezao/poirot · 13 tokens

chart-visualization

Generate charts: select type, extract data, render image.

HezaoHezao/poirot · 17 tokens

jacky-motion2-0-srt

A workflow for turning a Chinese spoken script and matching SRT subtitle file into a single 16:9 HTML information animation. SRT is a subtitle file that stores text with start and end times; the animation follows those times and adds recorded-screen placeholders when needed.

Jackywxsz/Jacky-motion · 127 tokens

video-podcast-maker

Use when the user gives a topic and wants an automated topic-driven narrated explainer, podcast, or knowledge-summary video (Bilibili / YouTube / Xiaohongshu / Douyin / WeChat Channels), or asks to learn visual design patterns from a reference video/image. Trigger when the user mentions creating a knowledge video…

Agents365-ai/video-podcast-maker · 214 tokens

video-podcast-maker-lite

Minimal personal narrated-video pipeline — a topic becomes a talking-head-free explainer MP4 (1080p or 4K) via script → Azure TTS (SSML) → Remotion. Use when the user wants a quick narrated video from a topic without the full video-podcast-maker machinery (no extra skills, no thumbnails/shorts/publish matrix). Do NOT…

Agents365-ai/video-podcast-maker · 96 tokens

video-podcast-maker-nano

Smallest personal narrated-explainer-video pipeline (spoken narration over visuals, not an audio podcast), fully tool-agnostic and autonomous by default — topic → research ∥ asset collection → script → TTS → video → 4K render ∥ publish info + cover. The skill defines the pipeline logic and self-verified checkpoints…

Agents365-ai/video-podcast-maker · 163 tokens