使用Hyperframes的HTML模板制作复古像素风格的三场景视频，替换标题、标签和配色，同时保留场景转换节奏及可重复的动画时序。
- 制作像素风格的介绍视频
- 替换三场景视频中的内容
- 通过HTML预览场景转换
nexu-io/open-design10.3万2026年10月22日 更新
免费在 GitHub 公开中文介绍
social-reddit-card
将提供的故事、问题或短笑话排成带投票栏和评论数的Reddit风格卡片，生成单个HTML文件，用于视频叠加或社交媒体分享。
原文查看原文说明
Realistic Reddit post card with vote rail and comment count, suited to video overlays or story sharing.
集成工具Reddit
AI 评分90分/ 100查看安装方法适用场景
- 制作视频叠加用Reddit风格卡片
- 在社交媒体上分享故事卡片
- 将问题或笑话呈现为帖子
- 根据背景调整明暗显示模式
中文介绍
功能
将用户提供的故事、问题或短笑话排成类似Reddit帖子的卡片。卡片左侧设有赞成与反对投票栏，并排列票数、社区名称、发布者、标题、正文和评论数等信息，最终汇总为单个HTML文件。可以选择浅色或深色显示模式，图标使用嵌入HTML的SVG绘制。
适用场景
适合在视频中叠加帖子风格的卡片，或在社交媒体上以卡片形式分享故事。资料给出了两种画布尺寸：视频叠加使用1280×720，单张卡片分享使用800×600。背景可以设为透明或深色，便于根据视频画面或分享场景选择显示方式。
使用示例
- “请把这段亲身经历做成深色Reddit风格卡片，用于叠加到视频中。”
- “请把这个问题做成带投票栏和评论数的分享卡片。”
注意事项
正文使用用户提供的内容。社区名称、用户名和票数会自动生成，因此若要将其作为真实帖子信息使用，需要先核实。不使用外部图片链接；需要图片占位时，使用CSS渐变和文字说明。
本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。
客观评估
AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。
- 指令清晰度能否看出何时使用、做什么
- A良好明确说明将故事或问题制作成Reddit风格卡片，用于视频叠加或分享。
- 步骤具体性步骤、输入输出和示例是否具体
- A良好指定了画布尺寸、投票栏宽度、配色、卡片组成及单文件HTML输出。
- 安全性发送数据、删除文件、执行命令等是否有说明
- B部分不足要求自动生成用户名和票数，但未说明如何标注这些虚构信息。
- 安装难易度所需工具和 API 密钥是否少且有说明
- A良好指定单个HTML文件和内嵌SVG，没有列出接口密钥或专用工具要求。
总分按每项 A=25 分、B=15 分、C=5 分相加。 由 AI（OpenAI Codex）于 2026年10月20日 评估。仅供参考，安装前请同时查看原文。
如果您认为评估有误，请申请复核
包含的文件（3）
- SKILL.md3.5 KB
- example.html3.8 KB
- example.md456 B
SKILL.md（原文）
安装前可以查看交给 AI 代理的指令内容。
【模板: Reddit 帖子卡】 【意图】把一段故事 / 提问 / 段子, 渲染成 Reddit 帖子卡片, 用于视频叠加、社媒故事分享。Inspired by hyperframes reddit-post。
【画布】1280×720 (视频叠加) 或 800×600 (单卡分享); 背景透明或暗色 #0b1416。
【卡片结构】
- 外框: 圆角 16px, bg 白
#ffffff(light) 或#1a1a1b(dark, 推荐 video overlay), border 1px#edeff1/#343536。 - 左侧 vote rail (40-56px 宽):
- 上箭头 ▲ (16px,
#878a8c, hover 变橙#ff4500)。 - 票数 (Inter, 17px, weight 700, 居中, 颜色: 0 灰 / 正橙 / 负蓝); 大数字用
12.3k格式。 - 下箭头 ▼ (hover 变蓝
#7193ff)。
- 上箭头 ▲ (16px,
- 主体区:
- 顶部 meta row: 子版块图标 (CSS 圆形 + 字母) +
r/subreddit(粗) +· Posted by u/username · 3h(小字灰)。 - 标题 (Inter / IBM Plex Sans, 22-28px, weight 500, dark text)。
- 内容: 16px body 或 引用块或 1 张图 (CSS 渐变占位)。
- 底部 action row: 💬
1.2k Comments· 🏆 Awards · ⤴️ Share · ⋯ icon。
- 顶部 meta row: 子版块图标 (CSS 圆形 + 字母) +
- 顶部右上角 Reddit Snoo logo (内联 SVG, 橙色
#ff4500)。
【字体】
- 主:
IBM Plex Sans→ fallbackInter, weight 400/500/700。 - 数字: 同主字体。
- 中文:
Noto Sans SC。
【设计细节】
- Light mode: bg
#fff, text#1c1c1c, secondary#7c7c7c。 - Dark mode (推荐): bg
#1a1a1b, text#d7dadc, secondary#818384, border#343536。 - 票数颜色: 正 =
#ff4500, 负 =#7193ff, 0 =#878a8c。 - 标题点击区可加微妙背景 hover。
- 严禁外链图片; 图片占位用 CSS 渐变 + 描述。
- 必须用用户提供的内容; 自动生成合理的 subreddit / username / 票数。
- 单文件 HTML; icon 内联 SVG (上下箭头、评论气泡、奖杯)。
评价
还没有评价。欢迎分享你的使用感受。
评论
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
同一仓库的技能
为社交媒体广告和搜索广告撰写标题、说明及正文，并反复调整措辞。可用于准备广告文案备选版本，以及检查现有文案并考虑修改方案。
- 撰写社交媒体广告标题
- 准备搜索广告说明
- 修改广告正文措辞
nexu-io/open-design10.3万2026年10月22日 更新
以深色背景和衬线字体制作时尚杂志风格的三页动态展示，结合文字逐步显现与章节转场，最终生成内嵌CSS和JavaScript的单个HTML文件。
- 制作时尚杂志风格的动态介绍
- 用三页展示简短故事
- 将现有品牌风格融入深色版面
nexu-io/open-design10.3万2026年10月22日 更新
通过浏览器查看页面，执行点击、输入、截图和信息提取。主要用于检查OpenDesign的本地预览，以及核查网页应用的运行情况与质量。
- 检查OpenDesign本地预览
- 测试网页应用的点击和输入
- 截取页面或元素图像
nexu-io/open-design10.3万2026年10月22日 更新
用于AI音乐专辑制作，涵盖概念构思、歌词初稿、曲目排序和导出，适合独立专辑实验或品牌音乐企划；完整制作流程需另行安装上游资源包。
- 策划独立制作的专辑
- 围绕专辑主题起草歌词
- 安排专辑曲目顺序
nexu-io/open-design10.3万2026年10月22日 更新
使用p5.js，根据计算规则与随机数创作生成艺术。固定随机种子即可重现相同画面，适合制作海报、表现动感的静态图像和艺术构图草案。
- 根据规则制作海报
- 创作具有动感的静态图像
- 试验艺术作品的构图
nexu-io/open-design10.3万2026年10月22日 更新