页面
在线演示的逐页截图，在页面框内滚动可查看完整页面。
设计解读
AI 对这套模板设计的解读：配色、字体、间距、区块和标志性细节。使用模板时，Ottermind 会以它为起点。
这份解读暂时还没有中文版本，先以英文显示。
- Overall
SaaS landing page, futuristic, high-density, dark
- Palette
background #09090b; surfaces [#2563eb, #fafafa, #3b82f6, #0ea5e9]; text #fafafa; muted text #a3a3a3; primary #3b82f6; accents [#2563eb, #0ea5e9]
- Type
headings heading, 700, sentence-case; body heading, 18px; scale h1 72px / h2 48px / h3 20px
- Shape & spacing
button radius 7.6px, card radius 24px, no borders, subtle drop shadows, section spacing 120px, content width 1152px
- Sections (top to bottom)
- Hero — full-width, centered headline with two CTA buttons, dark gradient background with faint circular overlay, floating dashboard mockup below
- Trusted brands — logo row centered, followed by feature grid of 5 cards in 2 rows (3+2), each with icon, title, subtitle, and illustrative UI element
- Dashboard preview — two data cards side-by-side (Campaign Insights, Audience Metrics), then Social Media Integration with central logo and radial social icons
- Pricing — two-tier plan cards (Standard, Mastermind) with toggle for billing, followed by language support grid with flags and names
- Footer — not visible in screenshots
- Signature details
- Floating dashboard UI mockup with macOS-style window controls
- Animated radial pulse around central social integration icon
- Subtle glow on interactive elements like buttons and hover states
- Consistent use of purple-blue accent gradients in charts and highlights
- Minimalist card design with rounded corners and soft inner shadows
- Micro-interactions implied via hover states and animated transitions
- Other pages
- /pricing: pricing comparison table with tiered features
- /features: detailed feature breakdown with illustrations
- /blog: article list with thumbnails and meta-data
- /contact: form with input fields and submission button
模板信息
- 分类
- Landing Page, SaaS, AI
- 作者
- larsen66
- 来源
- 21st.dev
- 价格
- 免费
- Landing Page
- AI
- SaaS
原始设计来自 larsen66，发布于 21st.dev。Ottermind 不会复制模板代码，而是根据需求生成一个全新的网站。
Ottermind 起步用的需求
它会作为草稿在 Studio 中打开，发送前先补充你的品牌、受众和页面。
Build a landing page website inspired by the "Vetra" template. Reference brief: Animated landing page for an AI marketing automation platform, built with Next.js, Tailwind CSS and Framer Motion. Use original copy and imagery for my brand rather than the reference's placeholder content.
如何使用这个模板
- 1
点击「使用这个模板」，在 Ottermind Studio 中打开并自动填入需求。
- 2
在需求里补充你的品牌、受众、页面和内容。
- 3
Ottermind 以这套设计为灵感生成一个全新网站，你可以在对话中继续修改。
