每次让Claude Code"给我做个落地页",出来的东西都像复制粘贴。
居中英雄区。全用Inter字体。文艺点就用Space Grotesk。H1标题配紫蓝渐变。标题上方飘个小药丸标签——"New"、"Beta"、"Now with AI"。底下三张一模一样的功能卡片,每张顶个Lucide图标,通常是zap、shield-check、sparkles。再来个1-2-3步骤行。导航栏搞毛玻璃效果。shadcn/ui遍地都是。深色模式配灰底深灰字,对比度不达标但"看着干净"。
做到第二十个的时候,我开始在梦里看见这玩意儿。于是不抱怨了,直接造了个工具。
uislop:一个Go写的CLI,给网页的"AI感"打分
输个URL,拉HTML和关联JS,跑一堆正则,吐一个0到100的数字。
$ uislop https://some-ai-startup.ai
font:Inter hits=12 weight=2 add=24
color:purple hits=8 weight=3 add=24
color:gradient hits=14 weight=2 add=28
css:shadcn hits=4 weight=4 add=16
icon:svg_lucide hits=11 weight=2 add=22
layout:centered hits=7 weight=2 add=14
layout:allCaps hits=9 weight=1 add=9
----
87
0分是"看着像人做的,或者2022年前的"。100分是"这页上周二刚氛围编程出来的"。
为什么用Go?跟我新项目默认选Go的理由一样:单二进制,到处跑,没virtualenv,没依赖漂移。scp到哪儿都能用,能grep全网。
我固化下来的信号
扫了几百家AI创业公司的落地页后,模式诡异的一致。
字体
- Inter: literally 所有地方
- Space Grotesk:想装文艺的时候
- Geist Sans/Geist Mono:Vercel元年
- Instrument Serif:H1里某个斜体词("the only ~platform~ you need")
- CameraPlainVariable:从cdn.gpteng.co加载,基本是Lovable的指纹
颜色
- VibeCode紫(#8b5cf6, #7c3aed)
- H1、CTA、图标背景、导航边框,到处渐变
- 深色模式用bg-zinc-950
- 正文text-zinc-400叠在bg-zinc-900上,3.8:1对比度,WCAG挂掉,"看着干净"
- 每个主按钮后面软色发光
布局
- 居中英雄区,max-w-3xl text-center
- H1上方小药丸标签(rounded-full bg-primary/10)
- 三张功能卡片,grid-cols-3 gap-8,每张顶个图标
- 编号步骤:01 - Sign up / 02 - Get started / 03 - Win
- 全大写区块标签,tracking-wider
- 数据横幅行("10k+ users"、"99.9% uptime"、"$0 cost")
图标
永远是Lucide。永远是这五个:zap、shield-check、bot、sparkles、rocket。首屏能看见全部五个,就是铁证。
CSS暴露点
- bundle里有shadcn基础组件
- 导航栏backdrop-blur-md bg-white/10
- Tailwind工具类大杂烩
- 资源URL里有cdn.gpteng.co
发布后的意外发现
几件事让我意外。
信号比想象的响。我本以为得上ML。结果HTML正则+关联JS扫一遍,明显案例能到90%+准确率。
Geist Sans对分数的拉高比预期猛。出现这个字体,基本等于大喊"我刚用Vercel模板"。
最讽刺的是:这个工具本身如果做成落地页,大概也得87分。
热门跟贴