Modèle de site web

Vetra

Animated landing page for an AI marketing automation platform, built with Next.js, Tailwind CSS and Framer Motion.

La description de ce modèle n’est pas encore disponible en français ; elle s’affiche en anglais.

Landing Page · SaaS · Gratuit

Pages

Captures de la démo, page par page. Faites défiler une page pour la voir en entier.

/Vetra - AI-Powered Project Management & Team Collaboration
Modèle de site Vetra, page /, partie 1Modèle de site Vetra, page /, partie 2Modèle de site Vetra, page /, partie 3Modèle de site Vetra, page /, partie 4Modèle de site Vetra, page /, partie 5

Analyse du design

Une lecture par IA du design de ce modèle : couleurs, typographie, espacements, sections et détails marquants. Ottermind en part quand vous utilisez le modèle.

Cette analyse n’est pas encore disponible en français ; elle s’affiche en anglais.

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

Détails du modèle

Catégorie
Landing Page, SaaS, AI
Auteur
larsen66
Publié sur
21st.dev
Prix
Gratuit
  • Landing Page
  • AI
  • SaaS

Design original de larsen66, publié sur 21st.dev. Ottermind ne copie pas le code du modèle : il crée un nouveau site à partir du brief.

Le brief dont part Ottermind

Il s’ouvre dans Studio comme brouillon — ajoutez votre marque, votre public et vos pages avant l’envoi.

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.

Comment utiliser ce modèle

  1. 1

    Cliquez sur « Utiliser ce modèle » pour l’ouvrir dans Ottermind Studio avec son brief prérempli.

  2. 2

    Ajoutez au brief votre marque, votre public, vos pages et votre contenu.

  3. 3

    Ottermind crée un nouveau site inspiré de ce design — continuez à l’ajuster dans la conversation.