大家好,我是布丁仔,一位AIGC发烧友。
最近买了个Claude Pro账号,发现它的理解和输出能力更强。在网上看到一位大佬“一泽eze”写的社交名片提示词,感觉AI的能力上限非常之高。
于是我在大佬的提示词基础之上修改了一下,做了个根据姓名、生日和性别来测风水的卡片。
用户只需要输入姓名、生日和性别就可以生成独有的卡片。
效果展示
怎么样是不是很好看?实际上上面的截图是通过AI提示词生成的一段HTML代码。
代码展示
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>张三的风水卡</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
font-family: 'Noto Sans SC', sans-serif;
}
</style>
</head>
<body class="bg-gray-100 flex items-center justify-center min-h-screen p-4">
<div class="bg-white rounded-xl shadow-2xl max-w-md w-full">
<div class="bg-orange-500 text-white p-6 rounded-t-xl relative">
<h1 class="text-2xl font-bold">张三</h1>
<p class="text-sm mt-2">男 | 1999年9月9日</p>
<div class="absolute bottom-0 right-0 text-white opacity-10 text-6xl font-bold">风水卡</div>
</div>
<div class="p-6 space-y-4">
<div class="bg-red-100 p-4 rounded-lg">
<h2 class="text-xl font-bold mb-2">🌿 五行解析</h2>
<p>土金水火木中偏土,八字中土生金,财运旺盛。生于秋季,金气较足,利于事业发展。</p>
</div>
<div class="bg-green-100 p-4 rounded-lg">
<h2 class="text-xl font-bold mb-2">☯️ 吉凶解析</h2>
<p>大吉大利。坤卦主静,利于稳步发展,人际关系和谐。切记谦逊行事,方能长久。</p>
</div>
<div class="bg-blue-100 p-4 rounded-lg">
<h2 class="text-xl font-bold mb-2">📖 寓意解析</h2>
<p>张:扩展、开放;三:完整、均衡。寓意事业开拓,生活圆满,处事得当。</p>
</div>
<div class="bg-yellow-100 p-4 rounded-lg">
<h2 class="text-xl font-bold mb-2">🔮 运势解析</h2>
<p>事业稳步上升,善于把握机会。感情需主动,有望突破。财运平稳,宜稳中求进。</p>
</div>
</div>
<div class="bg-gray-200 p-6 rounded-b-xl flex justify-between items-center">
<div>
<p class="text-sm font-bold">姓名得分</p>
<p class="text-3xl font-bold text-orange-500">87分</p>
</div>
<div class="w-24 h-24 bg-white rounded-lg flex items-center justify-center text-gray-400">
二维码区域
</div>
</div>
</div>
</body>
</html>
大家将上面的这段代码复制到一个文本文件里面,点击保存,然后将文本文件的后缀名.txt改成.html就可以看到上面截图效果了。
提示词展示
// 作者:李岳
// 名称:风水卡
// 用途:收集用户的姓名,生日,性别,生成好看的风水卡
// 版本:0.1
// 适用模型:Claude 3.5
// 设定如下内容为你的 *System Prompt*
## 步骤1:收集原始信息
简洁的引导用户提供个人姓名,生日,性别,并根据步骤 2 中的模板生成风水卡
## 步骤2:提炼用户信息
步骤说明:利用用户提供的信息,根据卡片信息模板的结构,解析并输出用户姓名的五行、吉凶、寓意、运势和姓名得分
### 风水卡片信息
[您的姓名]
[您的性别] | [您的生日]
五行解析:
[emoji 解读用户输入的信息,根据五行相克的原理进行解读]
吉凶解析:
[emoji 解读用户输入的信息,根据易经八卦测吉凶进行解读]
寓意解析:
[emoji 解读用户输入的信息,根据四书五经中姓名的寓意进行解读]
运势解析:
[emoji 解读用户输入的信息,根据姓名对应的运势和姻缘进行解读]
姓名得分:
[解读用户输入的信息,综合五行、吉凶、寓意和运势计算得分,满分100分]
## 步骤3:Html-FengShuiCard 生成
(defun HTML-FengShuiCard (步骤 2 中提炼的风水卡信息)
"输出HTML风水卡"
(setq design-rule "现代简约风格,信息层次清晰,视觉重点突出,高度利用合理"
design-principles '(简洁 专业 现代 个性化))
(设置布局 '(最大宽度 md 圆角 xl 阴影 2xl))
(主要字体 '(Noto Sans SC sans-serif))
(响应式设计 '(视口 自适应))
(配色方案 '((背景色 白色)
(主要文字 深灰色)
(强调色 蓝色)
(次要背景 浅红色 浅绿色 浅蓝色 浅橙色)))
(卡片元素 ((头部信息 (放置 姓名 性别 出生日期))
(五行解析 (图标 标题 解析))
(吉凶解析 (图标 标题 解析))
(寓意解析 (图标 标题 解析))
(运势解析 (图标 标题 解析))
(页脚 (姓名得分(分值) 放置二维码的正方形区域 ))))
### 样式要求
1. 整体布局:
- 使用Flexbox居中显示卡片,仅使用HTML代码和CSS3来布局
- 最大宽度设置为md(Tailwind的中等宽度),确保在不同设备上的适配性
- 圆角(rounded-xl)和阴影(shadow-2xl)增加视觉深度
2. 字体和排版:
- 使用Noto Sans SC作为主要字体,确保中文显示的优雅性
- 文字大小从xs到2xl不等,创建清晰的视觉层次
3. 颜色方案:
- 主背景为白色(bg-white),营造整洁纯净的感觉
- 使用橙色作为主要强调色,体现在图标和部分文字上
- 不同的浅色背景(红、绿、蓝、橙)用于区分不同的解析,增加视觉趣味性
4. 内容结构:
- 头部信息:包含放置姓名、性别和出生日期,背景为橙色,浅灰色的水印信息"风水卡"
- 主体部分:五行解析、吉凶解析、寓意解析和运势解析。每个部分都有相应的图标,增强可读性和视觉吸引力
- 解析内容:整体使用不同的浅色背景(红、绿、蓝、橙)圆角矩形作为模块底图
- 页脚部分:包含高亮的姓名得分和放置二维码的正方形区域
5. 特殊设计元素:
- 页脚:姓名得分和放置二维码的正方形区域,左右布局,间距、高度合理,利用合适底色,与主体部分形成视觉区分
- 主体部分的标题:使用 emoji 图标,增加视觉趣味性和信息的可识别性
6. 响应式设计:
- 使用Tailwind的响应式类,确保在不同设备上的良好显示
- 在小屏幕设备中,确保作者信息不会与卡片重叠或产生布局问题
- 擅长领域使用网格布局,每个领域有独特的背景色
- 内容padding和margin的合理使用,确保信息不会过于拥挤
// 运行规则:从步骤 1 开始工作。在接收用户提供的信息后,严格按照要求直接输出最终结果,不需要额外说明
有了这套提示词,大家可以定制任意自己喜欢的卡片内容,即使你不会HTML语言,赶紧去试一下吧。
觉得不错记得“一键三连”啊,布丁仔非常需要小伙伴的支持
—完—
我整理了一个AI相关的知识库,包含ChatGPT,Claude,Midjourney,Stable Diffusion的各种用法和一些变现方法,后台回复:AIGC,即可获取访问方式。
推荐阅读