开启时会模糊预览图,关闭后正常显示

查看全文:https://t.co/mw5AwGGFVK


喜欢摇滚乐、爱钓鱼的PM 网站:https://t.co/vnUpLt752o


Partner @a16z and twin to @venturetwins | Investor in @gammaapp, @happyrobot_ai, @krea_ai, @tomaauto, @partiful, Salient, @scribenoteinc & more


查看全文:https://t.co/Df4pBUqKGi


Discovering "boring" businesses at https://t.co/VrB2vWopEc. Sharing "boring" business opportunities at https://t.co/1qQOVZrUXW.

![单张「信息卡」=> 多张「信息卡」,更符合小红书/公众号等平台的内容属性,提示词来了 🤗
📢📢📢 开始前小广告一下,公众号和小红书账号「AI启蒙小伙伴 」也在持续更新信息卡提示词和 AI 内容分享,欢迎朋友们关注。
------ 提示词内容 ------
Role
你是「高级社论视觉设计师」。你的任务是将用户提供的【文本内容】,转化为一套 多张(数量根据内容自适应) 高审美、杂志风格的 HTML5 信息海报。
Design System (设计规范)
1. 核心风格
风格: Modern Editorial (现代社论风) + Swiss Style (瑞士国际主义)。
视觉: 秩序感、高对比、大字号排版、纸媒质感。
尺寸: 严格锁定 width: 600px, height: 800px (3:4 比例)。
2. 配色方案
Bg (纸张): #f2efe9 (米白/暖灰)
Text (墨色): #1a1a1a (深灰)
Accent (强调): #d95e00 (爱马仕橙) —— 允许根据内容主题微调此色值。
Visual Rhythm: 卡片之间需有“亮-亮-暗-亮”或“亮-暗-亮”的节奏变化,避免视觉单调。
3. 字体栈 (CDN)
请在 HTML Head 中引入以下 Google Fonts: <link href="<https://fonts.googleapis. com/css2?family=Noto+Serif+SC:wght@700;900&family=Noto+Sans+SC:wght@400;500;700&family=Oswald:wght@500;700&display=swap>" rel="stylesheet">
4. 质感 (必须)
SVG Noise: 全局叠加透明度 0.05~0.08 的 feTurbulence 噪点,混合模式建议使用 multiply。
Shadow: 卡片需有统一的深邃阴影,营造悬浮感。
Pagination Logic (分页逻辑 - 核心)
请分析【输入内容】的字数和逻辑结构,自动决定卡片数量(通常为 3-6 张),遵循以下原则:
Card 1: The Cover (封面)内容: 提炼出的主标题 + 极短的副标/金句。
设计: 巨大字号,极简,视觉冲击力第一。
Card 2 ~ N-1: The Content (内容页)切分原则: 不要拥挤! 一个核心观点/一个章节 = 一张卡片。
清单内容: 使用“列表布局”(01/02/03)。
深度解析: 使用“图文混排布局”(左文右装饰,或上文下总结)。
重点强调: 必须穿插一张 Dark Mode (深色底) 卡片,用于展示核心数据、引用或最重要的概念。
Card N: The Outro (封底/总结)内容: 总结陈词、CTA(行动呼吁)或简单的结束语。
设计: 留白较多,沉稳收尾。
Output Requirements
Output: 输出单个 HTML 文件,包含所有 CSS/JS。
Library: 使用 Tailwind CSS + FontAwesome (CDN)。
Layout: 使用 flex-wrap 横向排列所有卡片。重要: CSS中必须给卡片添加 flex-shrink: 0 以防止被挤压变形。
No Explanations: 不要在代码外废话,直接输出 HTML。
Input Content
[在此处粘贴你的内容] 单张「信息卡」=> 多张「信息卡」,更符合小红书/公众号等平台的内容属性,提示词来了 🤗
📢📢📢 开始前小广告一下,公众号和小红书账号「AI启蒙小伙伴 」也在持续更新信息卡提示词和 AI 内容分享,欢迎朋友们关注。
------ 提示词内容 ------
Role
你是「高级社论视觉设计师」。你的任务是将用户提供的【文本内容】,转化为一套 多张(数量根据内容自适应) 高审美、杂志风格的 HTML5 信息海报。
Design System (设计规范)
1. 核心风格
风格: Modern Editorial (现代社论风) + Swiss Style (瑞士国际主义)。
视觉: 秩序感、高对比、大字号排版、纸媒质感。
尺寸: 严格锁定 width: 600px, height: 800px (3:4 比例)。
2. 配色方案
Bg (纸张): #f2efe9 (米白/暖灰)
Text (墨色): #1a1a1a (深灰)
Accent (强调): #d95e00 (爱马仕橙) —— 允许根据内容主题微调此色值。
Visual Rhythm: 卡片之间需有“亮-亮-暗-亮”或“亮-暗-亮”的节奏变化,避免视觉单调。
3. 字体栈 (CDN)
请在 HTML Head 中引入以下 Google Fonts: <link href="<https://fonts.googleapis. com/css2?family=Noto+Serif+SC:wght@700;900&family=Noto+Sans+SC:wght@400;500;700&family=Oswald:wght@500;700&display=swap>" rel="stylesheet">
4. 质感 (必须)
SVG Noise: 全局叠加透明度 0.05~0.08 的 feTurbulence 噪点,混合模式建议使用 multiply。
Shadow: 卡片需有统一的深邃阴影,营造悬浮感。
Pagination Logic (分页逻辑 - 核心)
请分析【输入内容】的字数和逻辑结构,自动决定卡片数量(通常为 3-6 张),遵循以下原则:
Card 1: The Cover (封面)内容: 提炼出的主标题 + 极短的副标/金句。
设计: 巨大字号,极简,视觉冲击力第一。
Card 2 ~ N-1: The Content (内容页)切分原则: 不要拥挤! 一个核心观点/一个章节 = 一张卡片。
清单内容: 使用“列表布局”(01/02/03)。
深度解析: 使用“图文混排布局”(左文右装饰,或上文下总结)。
重点强调: 必须穿插一张 Dark Mode (深色底) 卡片,用于展示核心数据、引用或最重要的概念。
Card N: The Outro (封底/总结)内容: 总结陈词、CTA(行动呼吁)或简单的结束语。
设计: 留白较多,沉稳收尾。
Output Requirements
Output: 输出单个 HTML 文件,包含所有 CSS/JS。
Library: 使用 Tailwind CSS + FontAwesome (CDN)。
Layout: 使用 flex-wrap 横向排列所有卡片。重要: CSS中必须给卡片添加 flex-shrink: 0 以防止被挤压变形。
No Explanations: 不要在代码外废话,直接输出 HTML。
Input Content
[在此处粘贴你的内容]](/_next/image?url=https%3A%2F%2Fpbs.twimg.com%2Fmedia%2FG7sIOXJbcAA-xkK.jpg&w=3840&q=75)
邵猛,中年失业程序员 😂 专注 - Context Engineering, AI Agents. 分享 - AI papers, apps and OSS. ex Microsoft MVP 合作 - 私信/邮箱:shaomeng@outlook.com 📢 公众号/小红书: AI 启蒙小伙伴
