关于这个模板
这是 VEX Ventures 的首屏，连同生成它的那份需求简报一起发布，而不是只给一张截图。“We back visionaries and craft ventures that define what comes next” 就是整套版式要承载的那一行。字体是 Inter，字号由简报直接指定，而不是交给一套字阶去推。交付形式是 React 和 Tailwind CSS，收录于 800x603，所以画幅在任何一行代码写下去之前就已经定好。动效只限于1000ms 的过渡。对于需要在第一屏就显得刻意的金融科技产品首屏，它是一份合适的参考。下面引用的每一项都是那份简报里的数值，从 800x603 的画幅一直到最小的间距档。收录的提示词记录于 800x603，所以这一页引用的每个数值都能追回到它。
适合谁
- 给要改写一版首屏、标题长度又得和VEX Ventures一样的内容负责人用。
- 如果上线就在眼前，拿走 800x603 的画幅和 1000ms 的入场，构图其余部分先别动。
- 给已经装好 Inter、备好 800x603 导出件、这周就有构建档期的团队用。
包含哪些内容
- 导航是刻意做细的. 一短行链接加一个操作压在首屏上，尺寸按 18px 间距、1000ms 的过渡控住，导航条因此永远不会跟它背后的构图抢。导航条悬在 800x603 的构图上，自己没有底色，素材因此从它下面通到两边。
- 把数字当字体排. 数字是按文字排的，不是装进卡片的：Inter 的展示字号，标签低一档。数字是文字，所以它们沿用页面的响应式行为，而不是自己缩放。
- 没有一样是继承来的. 版式是对着一组固定值（18px 间距、1000ms 的过渡）解出来的，首屏在任何宽度下因此都保持成构图。画幅比例和尺寸记在一起，重建时连比例也一起对。
- 该放证据的地方放数字. 数字是按文字排的，不是装进卡片的：Inter 的展示字号，标签低一档。数字是文字，所以它们沿用页面的响应式行为，而不是自己缩放。一个数字要靠一段话才说得清，那它就不是数据点。
动效与交互
交互限制在局部
反馈只落在悬停态只给按钮和链接，而不是每张卡片上，这才让信息密集的首屏不显得拥挤。页面不会弹出模态框，也不劫持滚动；交互始终限制在元素本身。指针效果只留在控件上。这份参考在 800x603 下收录。
时长写进了需求简报
状态变化的时长写明为 1000ms，所以控件上的反馈是一个设计过的值，不是浏览器默认值。聚焦态和悬停态用同一个时长，键盘和指针的反馈因此一致。
这个首屏怎么重排
大多数响应式工作做到隐藏元素就停了。这里改的是版式形状：字阶是流体的，而不是阶梯式的，而且没有为了塞进首屏丢掉任何重要的东西。最后才会改的是顺序。这份参考在 800x603 下收录。
把 VEX Ventures 当规格书读
情绪板会把尺度留开，这份需求简报把它收死：18px 间距、1000ms 的过渡，周围的值都由这个决定推出来。这个首屏里没有任何一处依赖默认值。
把这个首屏变成你自己的
直接替换是有上限的：如果你的产品需要另一套层级，18px 间距、1000ms 的过渡会跟你作对。这种情况先改顺序，再改数值。换一个品牌，整套画幅都能接着用。
常见问题
VEX Ventures 背后的提示词到底有多长？
它是构建简报，不是感觉描述：写明 800x603 的构图、间距和动效数值。全文没有一处把渲染画面当作事实依据。
为什么这条条目还要标注 React 和 Tailwind CSS？
VEX Ventures 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
在客户项目里该怎么处理 VEX Ventures 的素材？
简报是描述，不是转授权别人素材的许可。结构和数值可以留下，素材和品牌标识要换成你自己的；客户问起版式出处时，说明来源即可。这份参考在 800x603 下收录。
