Name: social-x-post-card
Author: nexu-io

About

Imported from nexu-io/open-design (skills/social-x-post-card/SKILL.md) via skills.sh. Install upstream with npx skills add nexu-io/open-design --skill social-x-post-card. Copyright stays with the author.

【模板: X (Twitter) 帖子卡】【意图】把一段推文内容 (或用户的金句) 渲染成一张拟真度极高的 X 帖子卡片, 用于视频叠加、推特发图、知识沉淀。Inspired by hyperframes x-post。

【画布】1280×720 或 1080×1080, 暗背景 #0f1419 或亮背景 #ffffff (按 X 主题); 卡片居中, 阴影柔和。

【卡片结构】

外框: 圆角 16px, 1px border #2f3336 (dark) / #eff3f4 (light), 内边距 16px。
顶部 row: 头像 (48×48 圆形, 用 CSS gradient 占位) + 用户名 + handle @username + verified 蓝勾 + 时间 (mono, 12px, 灰)。
正文: 17-22px, 字重 400; 链接用 X 蓝 #1d9bf0; hashtag 同色; mention 同色; 段落间空 0.6em。
可选: 引用卡 (小卡内嵌, 灰底, 圆角 12px)。
可选: 1 张图 (CSS 渐变 + 描述占位, 不能外链图片), 比例 16:9, 圆角 12px。
互动 row: 4 个 icon + 数字 (回复 / 转推 / 引用 / 点赞), icon 用 inline SVG (X 官方风格), 灰色, hover 时变色。
顶部右上 X logo 单线 SVG。
浏览量 row: 👁️ + 数字 (小字)。

【字体】

西文: Chirp (X 的字体) → fallback Inter 或 Segoe UI。
中文: Noto Sans SC / PingFang SC。
数字: 同主字体, 不用 mono。

【设计细节】

配色 light: bg #fff, text #0f1419, secondary #536471, border #eff3f4, accent #1d9bf0。
配色 dark (推荐, 视频叠加用): bg #000, text #e7e9ea, secondary #71767b, border #2f3336, accent #1d9bf0。
数字格式化: 1.2K / 4.5M (不要原始 1234)。
内容必须来自用户输入, 不能编造推文。
若用户输入是数据 → 自动总结成一句"金句"推文 (≤ 280 字符)。
单文件 HTML; icon 内联 SVG; 不要任何外部图片 URL。
可选: 卡片背后加微妙径向高光 radial-gradient(...) 增加视频叠加的可读性。

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/nexu-io-open-design-social-x-post-card/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

nexu-io-open-design-social-x-post-card.ocm.jsonjson

{
  "ocm": "1",
  "id": "nexu-io-open-design-social-x-post-card",
  "kind": "skill",
  "name": "social-x-post-card",
  "description": "Realistic X post card with engagement metrics (likes, reposts, views), suited to video overlays or shareable image cards.",
  "publisher": "nexu-io",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "general"
    ],
    "tags": [
      "skill-md",
      "twitter",
      "x",
      "social",
      "card",
      "overlay",
      "skills-sh"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Realistic X post card with engagement metrics (likes, reposts, views), suited to video overlays or shareable image cards."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "skills.sh",
      "repository": "https://github.com/nexu-io/open-design",
      "path": "skills/social-x-post-card/SKILL.md",
      "ref": "HEAD",
      "url": "https://www.skills.sh/nexu-io/open-design/social-x-post-card",
      "key": "nexu-io/open-design/skills/social-x-post-card/SKILL.md"
    }
  },
  "instructions": "【模板: X (Twitter) 帖子卡】\n【意图】把一段推文内容 (或用户的金句) 渲染成一张拟真度极高的 X 帖子卡片, 用于视频叠加、推特发图、知识沉淀。Inspired by hyperframes x-post。\n\n【画布】1280×720 或 1080×1080, 暗背景 `#0f1419` 或亮背景 `#ffffff` (按 X 主题); 卡片居中, 阴影柔和。\n\n【卡片结构】\n- 外框: 圆角 16px, 1px border `#2f3336` (dark) / `#eff3f4` (light), 内边距 16px。\n- 顶部 row: 头像 (48×48 圆形, 用 CSS gradient 占位) + 用户名 + handle `@username` + verified 蓝勾 + 时间 (mono, 12px, 灰)。\n- 正文: 17-22px, 字重 400; 链接用 X 蓝 `#1d9bf0`; hashtag 同色; mention 同色; 段落间空 0.6em。\n- 可选: 引用卡 (小卡内嵌, 灰底, 圆角 12px)。\n- 可选: 1 张图 (CSS 渐变 + 描述占位, 不能外链图片), 比例 16:9, 圆角 12px。\n- 互动 row: 4 个 icon + 数字 (回复 / 转推 / 引用 / 点赞), icon 用 inline ",
  "cost": {
    "context_tokens": 298
  }
}

Fetch it by URL: GET /api/v1/registry/nexu-io-open-design-social-x-post-card/manifest?version=1.0.0

Reviews

Star ratings from people who tried it. One review per account; edit yours any time.

No reviews yet. Install it, try it, and be the first to rate it.