\DESIGNSORCERY>_

AI Agent & Chatbot Builder for WhatsApp + Website | Landbot

Video · Light

Design System Inspiration

Landbot — extracted via DESIGN.md

Customer Support · AI chatbot builder

clean interactive corporate dark-theme animated split-screen hero card-based layout scroll-triggered animations sticky navigation

Typography

Dmsans Bold 1

Heading

Aa Aa Aa Aa

Dmsans

Body

Aa Aa Aa Aa

Color palette

TL;DR

Landbot utilizes a "Navy Foundation" strategy where the primary structural color is a deep, professional navy `#33405e` (CSS `--lb-navy`), used for text, borders, and shadows. This sober base allows for high-voltage brand accents: an electric purple `#636bfc` (CSS `--lb-purple`) for primary actions and a vibrant pink `#ff3f7b` (CSS `--lb-pink`) for secondary highlights and badges. Typography is strictly sans-serif, pairing the geometric **DM Sans** for headlines with the rounded, friendly **Gotham Rounded** for UI elements. Layouts are defined by soft, generous radii (16px–20px for cards) and a distinctive shadow system that uses the navy token at low opacity (`rgba(51, 64, 94, 0.08)`) to create depth without graying out the canvas.

Target audience

The likely target audience includes businesses and marketers looking for AI-powered chatbot and agent solutions to qualify leads and support customers on WhatsApp and websites.

Full tech stack

CookieFirst Google Analytics Google Font API Google Hosted Libraries Google Tag Manager jQuery jsDelivr Landbot

Analytics

Google Tag Manager Google Analytics

Meta description

Build AI Agents in minutes that qualify leads, support customers and connected with your stack. Combine structured flows, AI flexibility, and branded UIs that convert.

Brand Voice

Empowering, direct, and outcome-oriented with a focus on speed and friction-less conversion.

Positioning

Landbot is an AI-driven conversational platform for revenue teams. It transforms static websites into interactive sales agents to qualify leads, automate support, and replace traditional forms.

Voice principles

  • Action-Oriented: Uses strong verbs like "Slash," "Turn," "Build," and "Engage" to emphasize immediate results.
  • Problem-Solving: Directly addresses pain points (friction, wait times, boring forms) and offers the tool as the specific antidote.
  • Accessible: Uses plain language to describe complex AI workflows, making the technology feel approachable and "intuitive."
  • Efficiency-Focused: Constantly highlights speed, mentioning "minutes," "simple steps," and "no credit card required."

More SaaS Designs

← Back to Gallery