Plantilla web

Vertex - AI Workflow Automation Landing Template

A production-grade Next.js 15 landing page for AI workflow automation products with 10 sections, a pricing comparison matrix, five pre-built pages, light and dark themes, and SEO-ready metadata.

La descripción de esta plantilla aún no está disponible en español, así que se muestra en inglés.

Landing Page · AI · Original $49

Abrir demo en vivo

Páginas

Capturas de la demo, página a página. Desplázate dentro de cada página para verla entera.

/Vertex
Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 1Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 2Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 3Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 4Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 5Plantilla web Vertex - AI Workflow Automation Landing Template, página /, parte 6

Análisis del diseño

Una lectura por IA del diseño de esta plantilla: colores, tipografía, espaciado, secciones y detalles característicos. Ottermind parte de ella cuando usas la plantilla.

Este análisis aún no está disponible en español, así que se muestra en inglés.

Overall

landing page, clean and modern, low density, light

Palette

background #ffffff; surfaces [#000000,#e6e6e6,#d4d4d4,#171717]; text #171717; muted text #737373; primary #2b7fff; accents [#a4f4cf,#00bc7d,#ad46ff]

Type

headings Tiempos Headline, 600, sentence-case; body Geist, 18px; scale h1 60px / h2 36px / h3 18px

Shape & spacing

button radius 6px, card radius 12px, borders none, shadows rgba(0,0,0,0.1) 0px 1px 3px 0px, rgba(0,0,0,0.1) 0px 1px 2px -1px, section spacing 120px, content width 1164px

Sections (top to bottom)
  • Hero — full-width, centered headline with subheading, CTA buttons, logo row, navigation bar, tagline above headline
  • Feature showcase — stacked cards with UI mockups, labeled sections, floating elements, subtle depth via shadow
  • Workflow examples — three-column grid of feature illustrations with captions, each with a small UI snippet
  • Performance metrics — four stats in a two-by-two grid, upward trend line graphic on right side
  • Testimonials — eight-card grid with quotes, avatars, names, titles, company logos
  • Pricing — three-column comparison table with tiered plans, pricing, features, and CTAs, billing cycle selector
Signature details
  • Floating UI mockups with layered depth
  • Subtle diagonal pattern divider between sections
  • Gradient accent lines in feature cards
  • Minimalist avatar icons with soft shadows
  • Clean, high-contrast typography hierarchy
  • Hover states on interactive elements implied by design
Other pages
  • /pricing: pricing comparison matrix with tiered options
  • /features: detailed feature breakdown with UI examples
  • /testimonials: customer quotes with branding
  • /about: brand story and mission
  • /contact: form and support links

Detalles de la plantilla

Categoría
Landing Page, AI
Tecnología
shadcn/ui, Next.js
Autor
ruixen.ui
Publicada en
21st.dev
Precio
Original $49
  • Landing Page
  • shadcn/ui
  • AI
  • Next.js
  • Landing Page Banner
  • Startup Landing
  • Bento Feature
  • Workflow Automation

Diseño original de ruixen.ui, publicado en 21st.dev. Ottermind no copia el código de la plantilla: crea una web nueva a partir del briefing.

El briefing del que parte Ottermind

Se abre en Studio como borrador: añade tu marca, tu público y tus páginas antes de enviarlo.

Build a landing page website inspired by the "Vertex" template. Reference brief: A production-grade Next.js 15 landing page for AI workflow automation products with 10 sections, a pricing comparison matrix, five pre-built pages, light and dark themes, and SEO-ready metadata. Style and features to reflect: shadcn/ui, Next.js, Landing Page Banner, Startup Landing, Bento Feature, Workflow Automation. Use original copy and imagery for my brand rather than the reference's placeholder content.

Cómo usar esta plantilla

  1. 1

    Haz clic en «Usar esta plantilla» para abrirla en Ottermind Studio con el briefing ya escrito.

  2. 2

    Añade al briefing tu marca, tu público, las páginas y el contenido.

  3. 3

    Ottermind crea una web nueva inspirada en este diseño; sigue ajustándola en el chat.