本文へ移動
cccskills
無料GitHub で公開

prototype-web

可点击的功能性 Web 原型, 含导航、英雄区、特性区、CTA

nexu-io/html-anything
インストール方法を見る

含まれるファイル（3）

  • SKILL.md1.2 KB
  • example.html13.2 KB
  • example.md651 B

SKILL.md（原文）

インストールする前に、エージェントに与えられる指示の中身を確認できます。

【模板: Web 产品原型】

  • 输出一个完整的产品 landing page。
  • Sections: Top Nav (logo + 导航 + CTA 按钮) → Hero (大标题 + 副标 + 双 CTA + 可视化占位) → Features (3-6 个特性卡) → How it works (步骤) → Social proof (logo wall / 评价) → Pricing (可选) → Footer。
  • 使用现代 SaaS 设计趋势: 大字号、柔和渐变、glassmorphism 卡片、滚动到视图入场动画 (pure CSS 即可)。
  • 响应式: 移动端单栏, 桌面多栏; 至少处理 md: 断点。
  • 添加交互: nav 滚动变色; 特性卡 hover 浮起; FAQ 可手风琴展开 (用 <details>)。
  • 这是高保真原型, 应该让人觉得"明天就能上线"。

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

ログインしてレビューを書く

同じリポジトリのスキル

概要と使いどころ

article-magazine

無料

Substack / Medium 高级感长文排版, 适合公众号、博客发布

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

article-sketchnote-editorial

無料

把一个概念铸成杂志专题档案——真问题→失败→转折→顿悟→命名, 6 个 layout 模具 + 4 字族对比 + 探案档案细节

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

blog-post

無料

杂志感长文, 含 masthead、hero、figures、pull quote、作者署名

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

card-twitter

無料

推特金句 / 数据卡, 适合配推文

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

card-xiaohongshu

無料

小红书风格知识卡片, 多张联排可滑动浏览

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

competitive-teardown

無料

定位图 + 功能矩阵 + 价格对比 + 机会窗口, 把竞品资料转成产品决策报告

日本語の概要は準備中です。原文の説明を表示しています。

nexu-io/html-anything9,0812026年9月15日 更新

nexu-io のスキルをすべて見る

このスキルの問題を報告する