加载中…
案例库 · 公开证据
提示语
为 "Aurai"——一款全天候 AI 健康伴侣——构建全屏 hero section landing page。页面是一个单独的 viewport-height section，包含循环背景视频和叠加内容。 ## 视频背景 - 全屏 `<video>` element，带有…
提示语
构建一个全屏单页 React + TypeScript + Vite + Tailwind CSS Hero 区域，在循环播放的背景视频上呈现“液态玻璃”美学效果。使用 `lucide-react` 提供图标。不要使用其他 UI 库。 **字体与全局…
提示语
创建一个 React + Tailwind CSS v4 + Motion（framer-motion successor）统计数据区块组件。使用 Vite 作为打包工具。该区块应完全适配移动端响应式布局。 ### 字体 在全局 CSS 中从 Google Fonts…
提示语
为“SynapseX”构建一个单页落地网站——这是一款未来主义神经 AI 界面产品。整个网站采用黑色背景、白色文字和全视口视频背景。所有文字均使用“Space Mono”（等宽字体）作为主字体。使用 React +…
source-motionsites prompt-public not-rerun license-review web-ui motion-3d
提示语
--- **提示词：** 创建一个位于固定背景视频之上的全 viewport section（100vh）。该 section 本身没有背景色——完全透明，因此可以透出其后的固定视频。 **背景视频（固定在所有内容之后）：** 一个固…
提示语
使用 Vite 构建一个 React + TypeScript + Tailwind CSS 单页 Hero 区域。整个页面都位于 `src/App.tsx` 中。除 `react`、`react-dom`、`lucide-react` 和 Tailwind 外，不使用其他库。 **背景：** -…
提示语
使用 React、Tailwind CSS 和 Lucide React 图标，为名为“Foldcraft”的创意工作室创建一个全屏 hero 落地页。页面是一个占满单个视口高度的区块，包含循环播放的背景视频、响应式…
source-motionsites prompt-public not-rerun license-review web-ui motion-3d
提示语
**在 Vite + React + TypeScript + Tailwind CSS 项目中构建一个全屏 hero section。使用 `gsap` 和 `lucide-react`。不要使用其他 UI 库。** ### 字体（位于 `src/index.css`） 在 index.css…
source-motionsites prompt-public not-rerun license-review web-ui motion-3d
提示语
使用 React、TypeScript、Tailwind CSS、Framer Motion 和 Lucide React，为「Jack」构建一个 3D 创作者作品集落地页。页面采用深色主题（背景为 #0C0C0C），字体使用 Kanit（Google Fonts，字重…
提示语
Build a single-page React + TypeScript + Vite + Tailwind site that is a full-screen video-background landing page with a contact form. Use `lucide-react` for icons. **Layout & Sizing** -…
提示语
为名为 "Axon" 的产品构建一个单页 hero 落地页——这是一个为繁琐工作流部署数字员工的平台。页面是一个全视口 hero 区域，包含循环背景视频和叠加内容。 **字体：** - 加载 Google Fonts：`Instrument…
提示语
使用 Tailwind CSS 3 和 Framer Motion，将一个“项目 / 案例研究”区块构建为 React + TypeScript 组件。字体为 `'DM Sans', sans-serif`（Google…
提示语
--- 为一家名为 "EngineTech" 的航空航天公司构建一个 **Site Footer**。这是一个黑色背景的页脚，包含带动画的点状顶部边框、带有大标题的四列导航网格、超大字号的字标品牌行，以及法律声明行。 ---…
提示语
**使用 Vite、Tailwind CSS 和 lucide-react，为名为 "Wandor" 的旅行应用构建一个单页 React + TypeScript 落地页。页面是一个全视口 hero…
提示语
使用 React、Vite 和 Framer Motion（`motion` package）创建一个全屏 hero section landing page。使用纯 CSS（不使用 Tailwind）。字体使用 Google Fonts 的 Inter（字重…
提示语
构建与落地页 CTA 区域像素级一致的复刻版本。使用 React 18 + Vite + TypeScript、TailwindCSS、`framer-motion`、`clsx` + `tailwind-merge` 作为 `cn()`。采用深色主题背景（`#000000`）、Inter…
提示语
为金融机构的对话式 AI 平台 **Boomerang** 构建一个占满单个视口的营销落地页。技术：React + TypeScript + Vite + Tailwind CSS + Lucide React（仅使用 `ArrowRight`）。不使用其他 UI…
提示语
在一个逼真的手机边框模型中构建移动端健康测验界面，并将其居中放置在白色页面上。使用 React、Tailwind CSS 和 Lucide React icons。 **手机边框：** - 尺寸：宽 375px x 高 780px -…
提示语
--- **重现“分类”区块的提示词：** > 使用 React + Tailwind CSS 构建一个“分类”区块，严格遵循以下规格： > > **区块容器：** > - 全宽 `<section>`，使用…
提示语
**像素级忠实地**复刻此页面。单个占满整个视口的首屏。React + Tailwind CSS。不要卡片，不要紫色，不要 Inter/Roboto。采用黑色/奶油色的编辑设计风格作品集外观。 --- ## 技术栈与页面框架 - Vite…
提示语
**构建一个单页 HTML 展示页，在中性的 `#F4F4F4` 舞台上并排显示两个 iOS 设备框架（每个 370x790px）。舞台使用 JS 自动缩放以适配视口。两部手机均包含 Dynamic Island、状态栏（时间…
提示语
**提示词：** 使用 **React + TypeScript + Tailwind CSS** 构建一个金融科技稳定币落地页的“使用案例”版块，并使用 **lucide-react** 提供图标（使用 `ArrowRight`）。确保完全适配移动端。 --- ###…
提示语
### 概述 为名为 "prmpt" 的品牌构建一个全屏、由滚动驱动的时尚/档案落地页。页面分为两个主要阶段： 1. **Hero 阶段**（滚动的前 100vh）：全视口视频背景，上方叠加…
提示语
构建一个名为 `FreedomSection` 的单一 React + TypeScript + Tailwind CSS v3 组件。它使用 `hls.js` 进行 HLS 视频流播放，并使用 React 的 `useEffect` /…
