Chatbase

Item: Chatbase
Rating: 7.3

AI agents for customer support, sales and product guidance.

chatbase.co Save page

7.3/10MABTU rating

DESKTOP · 1440 × 11,273/ ↗

MOBILE · 390

Section outline · Home

01heroText left with rating, magenta panel chat demo right1,147
02logo cloudBordered grid of customer logos
03productsThree 3D cube agents with captions
04testimonialOpenAI quote card with portrait
05featureNumbered steps left, analytics UI on magenta right862
06bentoGrid of UI feature tiles
07testimonialCentred quote
08featureBlue panel left, channel list right701
09testimonialsPhoto story carousel and G2 badges1,285
10securityBlack band with three hex badges784
11industriesPhoto card carousel850
12ctaCentred serif-accent heading, two buttons598
13footerBlue band, white link card, giant wordmark

Rating · Home

Visual design7.8

UX & clarity7.5

Originality7.4

Craft & consistency7.4

Motion6.0

Performance & a11y7.7

This page scores 7.4; the site score weights the home page double.

Main colours

Light & dark toggle·white background·vivid

Typography

Geistheading · sans · google Geistbody · sans · google Interaccent · sans · self-hosted

Stack & style

Next.js React Tailwind CSS

Minimal Bold typography Editorial Corporate / clean 3D Product-UI-led Bento grid Custom cursor Floating CTA Live chat Logo cloud Review badges Sticky header Testimonial slider

Also: PostHog, Meta Pixel, Vercel, Google Analytics

Design DNA

White page with faint grid-line borders, a neutral grotesk for headlines with italic serif words ('agents', 'customer') mixed in, and grey second clauses. Product demos sit on saturated magenta and electric blue square panels with white chat windows. Agents are shown as glossy isometric cubes in magenta, blue and amber. Sections: split hero with G2 rating, bordered logo grid, three agent cubes, quote card, agent lifecycle list beside analytics UI, a product-suite bento, blue deploy panel, story carousel with photo, black security band with hex badges, industry photo cards and a blue footer ending in a huge serif wordmark with stickers.

Worth borrowing

Set one or two words of a sans headline in italic serif for a human, editorial voice.
Place product chat windows on flat saturated colour squares instead of gradients or devices.
End the page with a cropped giant serif wordmark decorated with badge stickers.