跟 Opus 4.8 打的有来有回？！Kimi K3 首测

Kimi K3 正式上线了。

官方给的成绩单是全新 Kimi Linear 混合线性注意力架构，1M 上下文，编程、Agent、多模态都覆盖到了，同时模型有 2.8T。

在一众国内的 1T 模型里面，相当大了。

前几天泄露的时候，Twitter 上一些人说超过 Fable 5 了，或者说跟 Fable 5 打平了，我自己试了一下，其实没有。

数字归数字，手感得自己试。我找了 Claude Opus 4.8 当对照组，挑了四个有实际技术门槛的前端场景来测。

包括了 WebGL shader、3D 玻璃折射、多阶段滚动状态机、Awwwards 这些前端里面比较复杂的活。

所有案例都是一次性生成，提示词丢进去，不手动改代码，直接看结果。

我专门跟 Opus 4.8 做了对比测试，试完以后，发现确实能跟 Opus 4.8 打得有来有回。

案例一：从视频复刻 3D 玻璃棱镜网页

给模型一段视频，里面是一个旋转的 3D 玻璃菱形体，带棱镜折射、环形文字和产品信息。

提示词就一句话：看懂这个视频，复刻出来，文案换掉，其他尽量还原。

这题难在哪？“看视频→理解 3D 结构→写 WebGL 代码”（WebGL 是浏览器里做 3D 图形的底层技术，写起来接近游戏开发）。

模型得从动态画面里自己推断几何体形状、玻璃材质参数、排版方式，然后一口气生成 Three.js 3D 渲染加 CSS 环形文字加中文书法字体。

没有任何文字标注可以参考，全靠自己看。

K3 赢得还是比较明显的。

K3 的构图完整度很高。

棱镜居中，玻璃折射层次分明，环形文字均匀排布，中文书法字“棱镜”放在两侧位置恰当，左下角产品文案排列整齐。整体氛围跟原视频很接近。

Opus 4.8 的 3D 建模本身没有 K3 有玻璃的通透感，灰灰的，而且元素过大导致不协调，用来放在建模里面的表现折射的文字超出了 3D 元素的范围。

排版上“PRISM”几个大字直接叠在环形文字上面，各种元素互相打架，画面又挤又乱。3D 及格，整体观感拉胯。

K3 执行时间也更短。视频理解这个方向，K3 确实非常有优势。

案例二：贝塞尔曲线 WebGL 光带

Web3 暗黑科技风首屏：纯黑背景上一条发光贝塞尔波浪持续流动呼吸，被 20 多条垂直玻璃条覆盖形成棱镜色散，鼠标移动时波浪会跟着弯。

这题的提示词大概是四个里面技术密度最高的，已经不算前端了，是计算机图形学。

简单列一下它要求模型做的事：

写 Fragment Shader（一种在 GPU 上逐像素运行的程序，屏幕上每个像素的颜色都要靠它实时算出来）。

用牛顿法反解贝塞尔参数（屏幕上 180 万个像素，每个都要算出自己离那条曲线有多远，这需要解一个三次方程，通常用牛顿迭代法来逼近）。

多组失谐正弦驱动曲线运动（让曲线像呼吸一样有节奏感地蠕动。“失谐”的意思是几组不同频率的波叠在一起，避免看起来太机械）。

RGB 三通道差异偏移做色散（模拟棱镜效果：红、绿、蓝三种颜色沿稍微不同的方向折射，叠在一起就出现了彩虹镶边）。

exp 函数控制发光衰减（控制光线从亮到暗的过渡速度，参数给了精确范围，偏一点要么糊成一片白光，要么暗到什么都看不见）。

bloom 泛光（让最亮的部分溢出柔和的光晕）的强度、半径、阈值也全给了对应的值。

一次性把这么一个 shader 写对并调到位，说实话是很苛刻的要求。

这一局基本打平，各有侧重。

K3 更干净。黑底纯净，光带细而锐利，前景文字克制，没有喧宾夺主。不过玻璃条的色散效果不太看得出来。

在细节上 K3 单独对左上角 Logo 文字做了处理，还选择了左对齐，曲线也配合了排版。

一个发挥得好的点是，他给那几个散落的标签做了视差效果，鼠标在移动的时候，那几个标签也会移动。

Opus 4.8 的玻璃折射做得好一些，竖向条纹清晰可见，色散的彩色镶边也有。

但代价是画面整体偏亮，光带更粗，跟提示词要求的“亮区<15%”有些距离，同时排版上没有 K3 有新意。

有一个细节值得说：K3 在跑的过程中会自己截图来检查。

第一次生成的光带太粗了，更像一根发光棍子，但它自己看到了、自己改回来了。

Opus 4.8 是一次出货，不需要回头。路径不一样，最终效果差不多。

案例三：视差滚动卡片动画

9 张卡片在滚动过程中走过 5 种形态：扇形展开、斜向视差、3×3 九宫格、7 倍穿梭放大、横向滚动平移。全部用一条 GSAP master timeline 驱动，配合 Lenis 平滑滚动。

这个案例的复杂度跟前面几个不太一样。不是某个技术点特别难，而是整体编排的工程量太大。

9 个元素在 5 种拓扑之间切换，每种形态的数学逻辑完全不同（扇形要算角度、斜向要算对角线坐标、九宫格要算行列位置、穿梭要计算缩放中心、横滚要算水平偏移），但必须首尾相连跑在同一条时间轴上，中间不能跳帧。

卡片形态变了，文字位置也得跟着联动：扇形时标题居中，散开时文字挪到左边，九宫格时缩到顶部让路。

ScrollTrigger 和 Lenis 两套滚动系统还得同步（一套管动画触发时机，一套管滚动手感的丝滑度）。

人类开发者从零写这个，少说也得一整天。

Opus 4.8 略胜。

Opus 4.8 的首屏完成度不错。“DEAL”超大标题居中，9 张卡片在下方扇形堆叠，底部有 SCROLL 提示，层次清楚。

K3 有一个小 bug：首屏的标题短暂出现后又消失了，只剩一张蓝色卡片的角露在底部。

入场动画的时序出了问题，文字淡出被意外触发了。核心的滚动动画流程倒是两边都跑通了，但首屏印象上 Opus 更稳当。

案例四：家具网页动效设计

Awwwards 级全屏水平手风琴：

4-5 个垂直列展示家居场景，hover 展开收缩，配 clip-path 遮罩揭示、圆形画中画、文字淡入微交互、自定义光标跟随。

看着好像就是做个手风琴，但实际上要四层动效同时运作：

GSAP 缓动控制宽度伸缩（要有弹性和阻尼感，不是匀速机械运动）；

clip-path 动态遮罩做图片揭示（图片不能直接显示，需要像拉开幕布一样从中间向两边露出来）；

文字淡入位移要卡准展开节奏、自定义光标要 Lerp 插值跟随（带一点“拖尾”的滑动感）。

一层不难，四层一起上还得保持流畅和品质，就是另一回事了。

Opus 4.8 在设计感上更好些。

核心交互两边都实现了，hover 展开收缩都丝滑，动效质量差距不大。

差距在审美判断上。K3 走了一个明亮展览风：5 个面板均匀分布，底部各带标题，干净但层次有点平。

Opus 4.8 选了深色基调，默认展开第一栏露出白色椅子特写，每个面板有编号和竖排文字，顶部有品牌导航。

看起来更像一个真正在运营的设计工作室网站，信息层级和排版节奏都更讲究一些。

总结

案例

判定

3D 玻璃棱镜（视频复刻）

K3 胜，构图和排版完整度高出一截

贝塞尔 WebGL 光带

平手，K3 更克制，Opus 折射更到位

视差滚动卡片

Opus 小胜，首屏即正确，一次性成功率更高

家具网页动效

Opus 小胜，排版更细腻，审美判断更成熟

K3 有一个比较突出的特点：多模态能力确实在发挥作用。

案例一里它直接从视频提取 3D 结构和排版细节，还原度远超 Opus，这是“看得懂”带来的实打实的优势。

案例二里它在生成过程中自己截图检查、发现光带太粗、自己修正。

Opus 4.8 稳在精细排版和一次性成功率上。

K3 偶尔会有时序小问题或者第一版参数偏差，需要再跑一轮修正。

但 K3 是开源的，价格在 Sonnet 级别，用 Sonnet 的价格拿到接近 Opus 的产出，。

相较于之前的 K2.6、2.7 确实贵了一些，但是毕竟参数大了这么多，也能理解。

同时，我也用这套提示词跑了跟 GPT-5.6-Sol 的对比测试。

在效果上，5.6-Sol 明显会比 K3 好一些，同时 Fable 5 肯定也是类似的。

但这依然是一个非常值得庆祝的进步，毕竟 GPT-5.6-Sol 和 Opus 5 在价格上跟 K3 差得实在是太多了。

附录：完整提示词

以下是四个案例使用的完整提示词，感兴趣可以拿去自己跑一遍。左右滑动即可查看不同案例。

案例二 · 贝塞尔 WebGL 光带

案例三 · 视差滚动卡片

案例四 · 家具网页动效

← 左右滑动查看三个案例的完整提示词 →