
胶片条 Herov1.0.1
使用这个 Skill:制作界面原型与界面插画。
5.013 次下载0 次喜欢0 次收藏
$4.99
购买这个 Skill 能获得什么?胶片条 Hero 是一个可直接粘贴的 Hero 区块,附带用法示例与组件源码。由访客驱动的滚动或分步交互、入场动效收得住,不弹跳。配色、字号与圆角以 token 形式集中管理,改一次就贯穿整个区块。
更新于 2026年8月31日
效果预览
运行于
生成模型
宿主 Agent 模型
相似 Skill
查看全部 Skills你将获得
- Film Strip Hero 的完整源码:组件文件加一个可直接运行的用法示例,粘进项目就能改。
- 一份视觉契约:配色、字号阶梯、圆角、icon 描边与动效时长,集中成 token。
- 人像与实景图随包提供并已放进对应槽位,本地存储,不走远程请求。
适合
- 你需要一个 Hero 区块,想要成品而不是从零排版。
- 你希望页面首屏渲染出来就是完整状态,配图已经就位。
- 你想拿到可读、可改的源码,而不是再多一个需要跟着升级的依赖。
不适合
- 已经在跑成熟设计系统的团队——这里的配色和字号阶梯会和你的打架。
- 想要可版本化升级的 npm 包的人;这交给你的是需要自己维护的源码。
- 需要导航、表单、登录或结账流程的项目,这个区块都不覆盖。
品牌建立与视觉规范产品发布与应用增长数字出版物与网页展示制作界面原型与界面插画制作网页/单页站/仪表盘制作落地页成果可编辑视觉精美低门槛Warm NeutralTeal AccentKineticPhotographic
关于此 Skill

粘一个区块,页面顶部就完成了——标题、副标题、按钮、配图彼此之间的关系已经调好。不用排版,也没有留下灰块。
你会得到什么
- Film Strip Hero 的完整源码:组件文件加一个可直接运行的用法示例,粘进项目就能改。
- 一份视觉契约:配色、字号阶梯、圆角、icon 描边与动效时长,集中成 token。
- 人像与实景图随包提供并已放进对应槽位,本地存储,不走远程请求。
怎么用
- 告诉助手这个区块放在哪,它会先读你的项目,再按项目本来的写法写出来。
- 把文案换成你的。字号和间距自己站得住。
- 放你自己的图。有人物的位置放人像,其余放实景照片。
- 上线前在手机上看一眼,它本来就是按这个宽度做的。
开始前需要准备什么
- 最近实测
- v1.0.1 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
用户评价
评价加载中…







