社区 prompt 复刻

Quorum：保留自我的蜂巢思维招募页

为虚构蜂巢思维“Quorum”做的营销落地页：满屏会盯着鼠标看的蜂巢小脸（唯一的蓝格就是你），可以点成员借技能、向蜂巢提问、切换身份共享开关、挑选每周一天 9–5 的 Hive Day、用滑块算 5% 会费、浏览人脉与机会，最后走完一次入会申请。

出处 adamholter · 原项目 ↗

取舍：“向蜂巢提问”是预写答案加关键词匹配，不调用外部 AI；申请表不提交到服务器，只在页面内演示流程；在线人数、剩余名额和机会动态是本地模拟数据。

乔木 LLM 擂台 · 定价页

浅色背景、青绿点缀的单文件定价页：Free / Pro / Team 三列卡片，中间的 Pro 带「推荐」标记并轻微抬高，附功能对比表与常见问题，窄屏自动改为单列。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

Hush One 降噪耳机产品落地页

单色极简风格的降噪耳机落地页：可拖拽、可换色刻字的 Three.js 360° 产品，联动实时价格计算器和多步骤结账，另有客服与推荐机器人、吸附小窗视频、翻页倒计时、暗色模式等 prompt 列出的全部转化功能。

出处 KingLeoJr · 原项目 ↗

取舍：只做了 360° 查看，没有做 AR；产品图、配件图和演示视频由同一套程序化 3D 模型离线渲染，客户照片是插画头像；客服与推荐机器人是前端规则模拟；结账、邮件订阅和优惠码是演示流程，不产生真实支付或邮件；评价、奖项和竞品数据是虚构示例；倒计时是常青倒计时

虚构行星图鉴

一本可交互的虚构星系图鉴：八颗由程序化着色器实时绘制的奇想行星（玻璃世界、金缝熔岩星、甜甜圈形行星、带环气态巨行星等）环绕恒星 Vesper 运行，可以飞入查看档案和热成像/高程扫描、按真实尺寸并排对比，还能在锻造台设计自己的行星加入星系，全程配有 Web Audio 实时合成的环境音。

原作 Kappaemme · 原帖 ↗

创意前端开发者作品集（Next.js 首页 + Astro 博客）

虚构创意前端开发者 Mara Ellison 的完整作品集网站：粒子背景加逐词揭示的首屏、Chart.js 技能图表与可点词云、瀑布流作品配 Three.js 着色器转场弹窗、Swiper 评价轮播、可筛选展开的交互式简历、react-globe.gl 工作地点地球、带代码高亮、目录、阅读进度、…

出处 KingLeoJr · 原项目 ↗

取舍：reCAPTCHA、表单提交、Utterances 评论、在线客服与 Google Analytics 都依赖外网或后端，改为离线演示实现（本地校验、localStorage、关键词机器人、GA4 兼容 dataLayer）；AMP runtime 自托管，因此不是校验器意义上的有效 AMP；next/image 用预生成多尺寸 WebP 的自定义 loader；react-custom-cursor 只提供样式和 hover 状态，跟随动画用 GSAP 补齐；react-globe.gl 的 WebGPU/TSL 入口换成存根；头像与所有配图为脚本生成的矢量插画；未实际部署，也未做 Chrome 以外的浏览器实测。

PAIRS 品牌周鞋履商城

可直接运行的网上鞋店：首页展示参与特卖的品牌及其折扣等级，导航栏「尺码助手」弹窗给出各品牌尺码换算表与跨品牌换算，列表页按性别筛选，详情页用程序化 3D 鞋子做可拖拽的 360° 旋转和四张上脚效果图，购物车可把同款不同尺码合并成一条，结账页模拟分期方案与每期金额。

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

取舍：商品图、360° 视图和上脚效果图都是浏览器内程序化生成的 3D 渲染，不是实拍，上脚模特是风格化的人台腿；品牌和商品为虚构，尺码表参照常见换算规则编写；支付、信用审核、库存和评价均为模拟，订单只保存在当前浏览器会话。

空气质量实时监测系统

深色数据大屏风格的全国空气质量监测系统：337 城市实时地图与 24 小时 / 30 天时间轴回放，城市与站点的逐时及日累计图表，74 / 168 / 337 城市和汾渭平原城市、区县的日排名与月、年累计排名，任意城市的小时 / 日 / 月 / 年对比分析，以及可导出 CSV / Excel 的…

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

取舍：无法接入真实的国家空气质量实时发布接口，全部监测数据由确定性模拟模型生成（覆盖 2020 年至当前小时，整点自动刷新），不是真实观测；168 城市名单按重点区域近似构成；除北京、上海、广州、西安、成都、武汉外，站点名称由通用名称池生成；地图只绘制省级轮廓；Excel 导出为 SpreadsheetML（.xls）格式。

电路实验室：拖拽式电路实验模拟器

把电池、电阻、灯泡、开关、电表和导线拖到网格工作台上，金属端相碰自动生成金色接触点，双击元件设置电压等参数，点击右侧“Start Test”按欧姆定律和基尔霍夫定律求解电路：回路闭合时显示电流强度并用流动光点演示电流、点亮灯泡，断开时用红圈、虚线和编号标出断点并逐条说明，另有 6 步引导实验和实…

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

看板拖拽

三列中文任务看板（待办 / 进行中 / 完成）：用原生 Pointer 事件把卡片拖到任意列和位置，拖动时卡片跟手倾斜、目标列高亮并实时让出空位，每列都有「添加」按钮，所有改动自动保存在 localStorage。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

双栏 Markdown 实时预览

左侧带语法着色的 textarea 写 Markdown，右侧由手写渲染器逐键实时预览，默认载入「乔木 LLM 擂台」介绍，两栏按内容块同步滚动并标出正在编辑的段落，窄屏自动改为上下布局。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

Cellwise 智能电子表格

纯浏览器端从零实现的智能电子表格：Canvas 表格支持增删改查与记录表单、合并单元格、150 余个带自动补全和彩色引用高亮的公式函数、多级排序与自动筛选、随数据实时联动的柱状/折线/饼图，并用自写解析器原生导入导出 .xlsx 与 CSV。

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

取舍：只支持 .xlsx/.xlsm 与 CSV，不支持旧版二进制 .xls；图表不写入导出的 .xlsx（可单独导出 PNG）；导入时忽略条件格式、数据验证、批注、图片与数据透视表；公式不支持动态数组溢出。

淘宝「已买到的宝贝」订单页

仿淘宝网页版「已买到的宝贝」订单列表：26 笔模拟订单覆盖全部交易状态，付款、确认收货、评价、退款、查物流、订单回收站等流程都能实际操作，窄屏下自动切换成手机淘宝的卡片样式。

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

取舍：没有后端：订单、物流、店铺都是前端模拟数据，刷新即重置；支付密码输入任意 6 位数字即可；卖家发货、同意退款由计时器模拟；商品图是手绘 SVG 插画而非实拍；聊天回复是按关键词匹配的预设话术；淘宝其他页面的链接只弹出演示提示。

猫步：夜城横版跑酷

一只燕尾服黑猫在自动卷轴的夜色城市里一键跳跃前行，穿过煤气灯街、灯笼巷、霓虹高楼，最后在月光下的钟楼前坐下；路灯、灯笼和霓虹的动态光照、体积光与泛光营造出成熟的夜景氛围，爵士配乐和猫叫全部由 Web Audio 实时合成。

原作 BLITAST STUDIO · 原帖 ↗

取舍：没有真正的实时全局光照：间接光用分段半球光、烘焙顶点 AO、墙面光斑贴片、跟随补光、体积光锥和 Bloom 近似；同屏只有 8 盏真实点光（2 盏投影），轮流分配给附近的灯源；猫的模型和动作全部程序化生成，没有骨骼动画、动捕和毛发。

苔翼

点击让圆滚滚的苔藓小精灵扇动叶片翅膀，穿过黄昏古道上一座座长满青苔的石柱缝隙，得分越高，天色越从金色黄昏渐入苔光与萤火点亮的月夜。

原作 Ayi1337

超光速迎击战

从超光速跃迁出场开始，高速掠过霓虹都市上空，依次击破杂兵编队、中型战舰 GOLIATH 和最终 Boss 要塞母舰 NEMESIS 的 Three.js 3D 射击游戏，带追踪激光、连锁爆炸和泛光后处理，BGM 与音效全部由 Web Audio 实时合成，顺利的话约 1 分钟通关。

原作 @npaka123 · 原帖 ↗

魔方挑战：2×2 到 5×5

用 Three.js 打造的 3D 魔方游戏：可选 2×2、3×3、4×4、5×5 四个难度，拖动任意面即可转动对应层，拖动空白处可把整个魔方翻过来；打乱后计时挑战、自动判定六面还原并放礼花庆祝，“公式实验室”能把基础复原公式逐步演示在你自己的魔方上。

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

忘了哪边朝下的路

水彩加墨线风格的 Three.js 驾驶小品：车顶绑着收音机的小红车沿一条闭合的纸带公路前进，路面 90° 折上黄色大楼外墙、倒挂着穿过吊满房子的天花板，最后化作扭转成环的五线谱，驶过音符就能按节拍奏出每条街的圆舞曲旋律。

原作 Chetan Ankola · 原帖 ↗

取舍：水彩和墨线是屏幕空间的风格化后期渲染，不是颜料在纸上的流体模拟；小车沿路面轨道行驶，只控制横向车道和车速，没有车辆物理和碰撞；阴影只对大楼和天花板做了解析近似，没有阴影贴图；所有乐器和电台音效都用 Web Audio 振荡器与噪声实时合成，没有采样音色。

布兰布尔维克农场的故事

彼得兔水彩绘本风格的 3D 农场小游戏：挑一只马、猪、牛、猫或狗，在农场和小村里闲逛，靠近其他动物时按空格随机互动（碰鼻子、唱歌、跳马背、跳舞、捉人等），还能喝水、吃干草和水果，天上不时有鸟群和拖着横幅的双翼飞机飞过。

原作 mblaso · 原帖 ↗

取舍：彼得兔绘本画风用实时水彩后期着色器模拟，角色是程序化低多边形模型，不是手绘插画；动物叫声用 Web Audio 合成，是卡通化的近似；没有用 React（prompt 里列为可选项）。

Claude 之道：30 秒功夫特训蒙太奇

一段纯代码绘制、配乐全部由 Web Audio 合成的 30 秒水墨功夫成长蒙太奇：Claude 吉祥物从 2023 年“第一天”的粗糙像素小方块起步，在搜索网页、写代码、3D 建模的特训中从屡屡失败到一击即中、画质也越练越清晰，最后在暴风雨中攻克疾病、气候、能源与数学难题，迎来日出。

原作 Ishu Agrawal · 原帖 ↗

生命的意义是什么？

一部 55 秒的手绘剪纸拼贴小动画：纸片小人 Pip 顶着一个大红问号，先后试过“拥有更多”和“命中注定”，最后在种下一颗星星种子、和朋友 Lou 一起躲雨里找到答案——“生命也许没有自带的意义，是我们赋予了它”；画面全部用 Canvas 2D 程序绘制，八音盒、拨弦配乐和纸张、笔尖、雨声等音效…

原作 Harveen Singh Chadha · 原帖 ↗

取舍：基本没有简化。浏览器自动播放策略要求用户先操作才能出声，所以页面停在封面等点击播放，而不是打开即播；作品是网页里实时渲染的动画，没有另外导出视频文件。

体素足球：终场绝杀

黄昏下彩虹外墙的体素球场里，黄衣 10 号用踩单车和彩虹过人连过两名红衣后卫、凌空抽射直挂死角，随后 GOAL! 体素大字、彩纸炮、火焰柱和烟花齐放，导播自动切镜，附慢镜回放和 Web Audio 实时合成的现场音效。

原作 Delusionals · 原帖 ↗

灯塔与鲸

一部两分半钟的实时动画短片：风暴夜里守灯人停下旋转的灯，为迷途的小鲸照亮一条路；多年后灯塔熄灭，长大的鲸鱼唱着那支老歌归来，用一身荧光为雾中迷航的小船引路——画面、配乐和音效全部由代码在浏览器里实时生成。

原作 春和景明.LinxAI · 原帖 ↗

水循环 · 无缝循环动画

一块漂浮的立体剖面小世界：阳光把海水蒸发成水汽，水汽凝结成云随风飘向雪山，化作雨雪落下，再经溪流、河流与地下水回到大海；一颗发光水滴每 32 秒完整走一圈，首尾无缝衔接，全部由代码实时渲染。

原作 Higgsfield AI 🧩 · 原帖 ↗

星咏召唤 · 抽卡演出

Three.js 星空祭坛上的日式手游抽卡演出：召唤阵蓄力并由蓝→金→虹逐级升格，光柱爆发后星屑逐张化为卡牌翻开，SSR 还有金卡碎裂升虹、落雷和全屏切入，音乐音效全部由 Web Audio 实时合成。

原作 @gigabit_million · 原帖 ↗

取舍：卡面用 Canvas 程序绘制的星座图代替手绘角色立绘，角色台词只显示文字、没有配音；抽卡和星晶石为前端本地模拟（不足时免费补充），刷新即重置。

霓虹流体：GPU 欧拉烟雾模拟

完全由 WebGL 片元着色器在 GPU 上解算的欧拉流体（平流、散度、25 次 Jacobi 压力迭代、梯度减除、涡量约束）：拖拽或快速划动注入循环变色的 HDR 霓虹染料，卷成湍流烟雾，终帧着色器内完成辉光、色调映射和边缘色差，右下角玻璃拟态面板可调粘度、染料持久度、笔刷半径并切换三套配色。

原作 theailoser · 原帖 ↗

EGRESS 人群疏散模拟：看哪里堵

俯视平面图上的社会力人群疏散模拟：人群按步行时间和排队情况选出口涌向门口，拥堵热力图、实时堵点圈和整场累计的堵塞地图标出人群卡在哪里；可以画墙、开关出口、调人数和紧急程度，对比疏散时间。

原作 Dom · 原帖 ↗

百万散点聚合热力图（D3）

用 d3.js 把 100 万个 [x, y, value] 散点实时分箱成方格或六边形热力图：可选均值、中位数、计数等聚合与多种色标，叠加等值线和行列剖面，缩放时按视窗重新分箱，支持悬停统计、色条筛选和 CSV/JSON 导入导出。

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

GitHub 贡献日历热力图

用 Vue 3 + D3.js 绘制的 GitHub 风格贡献日历：按四分位分级着色、逐周波浪式过渡，支持悬停提示、点选和键盘导航，并与统计卡片、星期/月份柱状图、每周趋势和当日活动详情联动高亮；可切换年份、周起始日、方块/圆点、亮暗主题和四套配色，支持导入 JSON/CSV/GitHub Gr…

出处 ArtifactsBench (Tencent Hunyuan) · 题目 ↗

取舍：没有在浏览器里实时调用 GitHub API（需要个人访问令牌），默认展示可复现的示例数据，另提供 GraphQL 查询语句和导入功能加载真实数据；当日活动列表只对示例数据生成，内容是虚构的。

7 日延迟 · 纯 SVG 折线图

浅色卡片里的纯 SVG「7 日延迟」折线图，坐标轴、渐变面积、数据点、中文图例和 7 日均值线齐全，悬停、点按或方向键即可看到当天数值与较前日变化，宽度随窗口自适应而文字和线宽保持原尺寸。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

佩拉吉亚 · 海洋铁路

一座带透明水体剖面的椭圆形热带小岛沙盘：红白复古小火车从海边车站出发，驶过高架桥，缓缓潜入穿越珊瑚礁的玻璃海底隧道，再绕回车站；水下有鱼群、海龟和斑点鲸鲨巡游，可切换四种视角和日间、黄昏、月夜三种光照，音乐和音效全部实时合成。

原作 @vib3coded · 原帖 ↗

取舍：Three.js 按交付约定经 import map 引用 ../vendor 本地副本，没有内联进 HTML，所以需要通过 HTTP 打开（file:// 下 Chrome 会拦截 ES 模块）；动物避障靠预先规划、并用完整身体包络校验过的平滑闭合航线保证（运行时持续监测），不是实时转向 AI；玻璃隧道和玻璃剖面用透明材质加菲涅尔表现，水面没有折射扭曲；环境没有 GPU，只在 SwiftShader 软件渲染下测试。

交互式 3D 史前岛屿

一座装在透明海水圆柱里的史前岛屿微缩模型：火山、瀑布、淡水池、研究站和栈道之间，蜥脚类、三角龙、剑龙、霸王龙与副栉龙、似鸡龙群靠骨骼与 IK 踏实行走、绕开障碍，翼龙盘旋，绿色蛇颈龙在剖面水下游弋，可以投喂、饮水、休息、呼唤、迁徙、孵蛋、唤出海兽，并切换昼夜与雨、风、火山。

原作 Vib3Coded · 原帖 ↗

无障碍登录表单

「乔木 LLM 擂台」中文登录页：每个控件都有标签，提交时逐项校验邮箱格式，用 aria-live 播报错误并把焦点移到第一个出错项；显示密码按钮用 aria-pressed 表示开关状态，键盘焦点呈高对比双色焦点环，右侧还有实时展示读屏朗读内容的语音查看器。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

纯 CSS 文档页：Tabs + FAQ 手风琴

虚构 SDK 文档页的局部 UI：顶部「概览 / API / 示例」三个 Tabs 用 radio hack 实现，选中项是滑动的实心品牌色胶囊，手机上可横滑并带两端渐隐提示；下方 3 项 FAQ 用原生 details 做成一次只展开一项的手风琴，全程零 JavaScript，并支持深色模式与…

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗

青绿设计 Token：light / dark 一键切换

一页青绿主色的组件展厅：按钮、表单、卡片和可搜索筛选排序的数据表格只引用 CSS 语义变量，一键（或按 T）以圆形揭示动画在 light / dark 两套 token 间切换，选择写入 localStorage、刷新后保持，页尾还能并排对照两套 token 的色值与实时对比度。

出处 乔木 LLM 擂台 (joeseesun) · 题目 ↗