18 Best AI SaaS Website Designs (And Why 'AI Means Dark Mode' Is Wrong)

There is a widely repeated idea that AI companies all build the same website: dark background, purple-to-blue gradient, glowing orb, vaguely cosmic. It is repeated often enough that people design against it.

It is also, measurably, not true. This catalog contains 33 companies in the AI category, and the style tags break down like this:

Light beats dark two to one. The cliché exists because dark launches screenshot beautifully and get shared, not because the category looks that way. The full 355-site data study has the same finding across every category, and we compared AI against fintech specifically in an earlier piece.

What follows is eighteen of those AI sites, each reviewed from the capture rather than from memory, grouped by the pattern they represent.

Pattern one: the prompt box replaced the CTA button

The most genuinely new thing in AI web design. Rather than a button that takes you somewhere, the fold contains a working input. The first action available is using the product.

Lovable

Lovable has no CTA button in its hero. The headline is "Build something Lovable," the subhead is "Create apps and websites by chatting with AI," and beneath them sits a single large input reading "Ask Lovable to create a landing page for my…" with an attachment control, a "Build ⌄" mode selector, a microphone and a circular submit arrow.

The background is an enormous, very soft gradient — blue at the top through magenta to orange at the bottom — so diffuse it reads as light rather than colour. The palette extracts as #FE5A2A, #FE1B78, #FE3948, but nothing on the page feels loud, because the gradient has no hard edges anywhere.

The placeholder is the cleverest part: "create a landing page for my…" is unfinished, so your brain completes it before you have decided to try anything.

Bolt

Bolt runs the same structure inverted to dark. The headline sets one word in blue italic — "What will you build today?" — over "Create stunning apps & websites by chatting with AI." The prompt field is pre-filled with "Let's build an admin panel to manage…", with a "Plan" mode toggle and a blue "Build now ▶."

Two additions are worth stealing. Directly under the input: "or import from" followed by Figma and GitHub chips — acknowledging that a serious user probably already has work somewhere else. And a sweeping blue arc of light curves behind the input, the only decoration on the page, functioning as a spotlight rather than as texture.

Below the fold, "Your company's design system, now in Bolt" introduces cards featuring recognisable brands. Built with Remix and Tailwind, one of only three Remix sites in the catalog.

VEED

VEED's page is a tool landing page rather than a homepage — the breadcrumb reads Home › VEED Tools › AI Video — and it is a good model for anyone building programmatic feature pages. The headline is set in heavy condensed caps: "AI VIDEO GENERATOR."

The input reads "Describe a topic or paste a script," and beneath it sits a rotating suggestion carousel with arrows either side: "‹ Try: Customer testimonial ›." Rather than one static example, it cycles through use cases, teaching the product's range in the space of a placeholder.

Below, a grid of real generated clips tagged Ad, Tutorial, Promo, Story and Product Review. The second row is the surprising part: those tiles are labelled "OpenAI Sora 2 Demo," "VEED Fabric Demo," "Google Veo 3.1 Demo," "Kling 2.5 Turbo Demo." Naming competing models in your own hero is a confident positioning move — it says the platform is the layer above whichever model wins.

Heidi

Heidi has the most unusual headline construction in this set. Instead of a sentence, three words sit in a row in a serif face: Scribe, Evidence, Comms — the flanking two greyed back, the middle one active. The headline is a product switcher. Underneath, a short line: "Get answers, keep moving."

The input below is filled with a real clinical question — "What should a patient know before starting a statin?" — followed by intent chips: Look up, Research, Treat, Explain, Compare. For a clinician, that question is instantly recognisable as the real job.

Two more details. The logo strip names medical publishers rather than tech companies: BMJ Group, Vidal Group, EMGuidance, MIMS. And a bar at the bottom of the fold reads "Ask AI about Heidi:" followed by icons for several assistants — inviting you to verify them through a third-party model. That is the first time we have seen that pattern in the catalog.

Perplexity

Perplexity takes the pattern to its conclusion: there is no marketing homepage. No headline, no value proposition, no CTA, no logo strip.

What loads is the application. A left sidebar with New, Computer, Spaces, Artifacts, Customize and History, showing "No recent sessions." A top row of verticals — Discover, Finance, Health, Academic, Patents. The wordmark centred, and under it an "Ask anything…" field with model selection, a microphone and a submit control. Two cards explain the two modes: "Search anything" and "Get work done with Computer," the latter tagged NEW. "Sign In" sits quietly at the bottom of the sidebar.

This only works when the product is instantly comprehensible and free to try — nobody needs a paragraph explaining a search box. It is the most extreme answer to "what should our homepage be" in the entire catalog, and it is the correct one for exactly one kind of company.

Pattern two: the output is the wallpaper

Where the product generates media, several sites build the fold from that media rather than from interface screenshots.

TwelveLabs

TwelveLabs sets two short sentences on a near-black page: "See the unseen. Know the unknowable." The subhead earns them — "Your video contains every insight, every event, every decision that mattered. Extracting it has been impossible. Until now."

The background is the argument. Hundreds of tiny video thumbnails — sports, aerials, street scenes, gradients — sweep across the page in long diagonal bands, dense at the edges and thinning toward the centre where the type sits. It reads as an index of footage being combed, which is precisely the product.

CTAs are "Try on Playground ↗" and "Talk to Sales ↗", both self-serve and enterprise, and a small toast card in the corner announces "Pegasus 1.5 — Transform video into Time Based Metadata." Built with Framer.

Krea

Krea writes its own name into the headline — "Krea.ai is the world's most powerful creative AI suite" — and stages the product physically: the app appears on a real monitor on a desk with a keyboard and mouse, in a dim room with a bookshelf behind it. Inside the screen, a canvas reading "Let's create something."

The staging does real work. A flat dark screenshot on a dark page disappears; a photographed monitor gives the composition depth and supplies the only warm light on the page. Secondary CTA is "Launch App," aimed at people who already have an account — an unusual thing to prioritise in a hero, and a sign of how much of Krea's traffic is returning users. Svelte and Tailwind.

Runway

Runway shows generated video in the least product-like way possible: two hands holding a tablet at a wooden dining table, glass of water and fork beside it, an animated character with a birthday cake on screen.

Showing output inside a player says "here is a tool." Showing it on a tablet at a kitchen table says "here is where this ends up." The headline, low-left in plain white, is a research claim rather than a product one — "Building AI to Simulate the World" — with a faint list of segments behind it: Runway Characters, Media and Entertainment, Robotics and Autonomy, General World Models.

ElevenLabs

ElevenLabs solves a harder problem: how do you show audio? Its answer is a carousel of soft gradient spheres — pink-purple, blue-orange, red-pink with a play control, green- orange — each labelled with a voice mode: Characters, Narration, Conversational, with a one-line description under each.

Two structural notes. The subhead does not sit under the headline; it sits to its right, in a second column, listing the product families (ElevenAgents, ElevenCreative, the voice generator). And the sphere carousel lives inside a tabbed panel — ElevenCreative, ElevenAgents, ElevenAPI — letting three product lines share one hero, the same trick Attio uses in our thirty best.

Pattern three: enterprise AI has no self-serve path

The clearest split in this category. Where the buyer is a bank or a Fortune 500, the fold contains no signup at all.

Hebbia

Hebbia opens with a small eyebrow — "AI FOR FINANCE" — and then the most severe typography in this set: "INSTITUTIONAL INTELLIGENCE" in enormous high-contrast didone capitals, the sort of face used by a private bank rather than a software company.

The subhead names the buyer precisely: "Purpose-built AI trusted by leading investors, bankers, advisors, and Fortune 500 companies for high-stakes decisions." One CTA, a small blue "CONTACT SALES." No trial, no docs link, no signup.

The imagery matches: a 3D render of a fluted bronze architectural form sweeping across the right of the frame, followed by video of a skyscraper. Nothing about the page suggests you could try it this afternoon, which is the point.

V7

V7 uses parallel construction: "Stop reading documents. Start making decisions." The subhead does something subtler — key phrases are set in bold inside an otherwise light sentence: "V7 runs due diligence, builds IC memos, and delivers decision-ready outputs from your data room. Every number traced to source."

Skim it and you read four nouns that describe your job. That final clause — "Every number traced to source" — is doing the heaviest lifting on the page, because hallucination is the single objection that kills AI deals in finance.

One CTA: "Book a demo." Below, a logo row under the line "Shaping the future of investment intelligence," naming firms a finance buyer recognises — Star Mountain, Alaris, Centerline, S&W, EMK Capital, Giant Thornton.

Refold AI

Refold AI colours the middle of its headline: "AI Integration Delivery Layer for Enterprise Systems," the centre phrase in blue. The subhead names the systems of record directly — SAP, Oracle, Salesforce — and makes a concrete promise: "integrations in days instead of quarters."

The detail worth copying is in the logo strip. Under "TRUSTED BY," the logos sit in a bordered grid, and three of them — incorta, naehas, Kantata — carry a small "CASE STUDY" tag beneath the wordmark. A logo says someone signed. A case-study tag says there is evidence, one click away. Most logo clouds do not bother.

CTAs are "→ REQUEST A DEMO" and "WATCH AGENTS IN ACTION." Again, no self-serve.

Pattern four: editorial type as the credibility signal

Across the catalog Inter appears on 112 of 355 sites. In enterprise AI specifically, rejecting it has become the way to signal that you are not another wrapper.

Cartesia

Cartesia sets "Architecting AI that learns and interacts like humans" in a serif, with the final two words in green. As with ElevenLabs, the supporting paragraph sits to the right rather than below.

Instead of a product screenshot, the page shows a large green line-art isometric drawing of an office floorplan — desks, meeting rooms, plants, tiny figures at work — above a tabbed selector for Finance, Healthcare and Government. A voice-infrastructure company showing the rooms its voices will be heard in, rather than a waveform.

The palette is pale sage and cream (#B4D9BC, #F8F8F6), and an announcement strip runs model releases: "Sonic-3.5 and Ink-2 now live." Built with Astro and Tailwind.

Adaline

Adaline is the airiest page in this set. A pill reads "THE SELF-IMPROVING AGENT ↗," the headline is three words — "Never stop learning" — and the subhead is one sentence about finding fires before they happen. Two small CTAs: dark green "SIGN UP," outlined "READ DOCS."

Then nothing, for most of a screen, before a "TRUSTED BY" row: salesforce, DOORDASH, Reforge, HubSpot, same. The emptiness is the composition — everything above is small and calm, so the logos land as the loudest element on the page. Palette is deep green on off-white (#203B14, #ECF2DF), with akkurat and Newsreader for display and fragmentMono for body.

Exa

Exa prices its own tradeoffs in the fold. Under the headline "Web search, built for AI agents," a mock console shows a query, a LATENCY row offering Fast 450ms, Auto 1s, Deep ~10s, category chips, and a "↓ 78% tokens" badge above results with visible source domains.

Putting latency and token cost in the hero is a pitch aimed at an engineer with a spreadsheet open. Around the demo, scattered thumbnails — sky photos, charts, page fragments — suggest an index being crawled. Display face is Arizona, a serif, against ABC Diatype and Inter for body.

Wispr Flow

Wispr Flow mixes two serif treatments inside one line — "Don't type," light grey, "just speak," darker — on a cream ground. Then it demonstrates rather than describes: long ribbons of raw transcribed speech curve in arcs around the hero, reading "…honestly the whole thing's been kind of chaotic, like nobody really knows what's going on…" beside a waveform capsule.

Messy input drawn literally, curling around the promise of clean output. The CTA commits to one platform — "Download for macOS" — with "Available on Mac, Windows, iPhone, and Android" underneath. Built in Webflow.

Pattern five: two that fit nowhere else

Mistral

Mistral splits the page unevenly: roughly seventy per cent white on the left carrying "Frontier AI. In your hands." in large black type, and a narrow grey right-hand column holding the supporting sentence, a news carousel ("Vibe gets to work") and three small down arrows suggesting scroll.

Below the headline, a block of orange and red pixel mosaic — squares and diamonds in vermilion, scarlet and amber — with the words "IN YOUR HANDS" set tiny inside it and a small pixel-art cat sitting at the edge. The cat recurs: the cookie banner is headed "Purr-fecting your experience with Cookies."

For a European frontier lab positioning against American incumbents, a hero built from a French-flag orange mosaic and a joke is a deliberate refusal of the genre. One honest flaw in our capture: the cookie modal covers the lower-left corner of the mosaic.

LangChain

LangChain sets "Powering the Agent Development Lifecycle" in a blue gradient over near-black, with a floating rounded nav bar above and two CTAs in a monospaced face — "Start building" and "Get a demo."

The illustration is the argument. Four small pills sit in a row — Build, Test, Deploy, Monitor — each trailing a long curved line downward, and all four lines converge into a single vertical stroke running down the page. The whole product thesis, drawn once, with no interface visible. For a company selling a workflow rather than a screen, that is the right call.

What the AI category actually looks like

Counted across all 33 AI sites in the catalog, not just the eighteen above:

Light, not dark. 22 light against 11 dark. The cliché is a selection effect.

No testimonials, anywhere. Zero of the 33 AI sites have a captured testimonial section — the only category in the catalog where that is true. Logo strips (7) and about pages (24) are common; named customer quotes are absent. Young companies have logos before they have quotable references, and it shows.

Pricing is scarce. Only 10 of 33 have a capturable pricing page, against 24 of 43 in productivity. Between enterprise negotiation and usage-based billing that nobody wants to publish, most AI companies avoid the page entirely.

FAQs barely exist. 3 of 33. For a category whose buyers have unresolved questions about accuracy, data handling and cost, that is a real gap rather than a stylistic choice — and the easiest thing on this list to fix. We looked at what a good FAQ section actually does across 68 examples.

The pattern worth taking away is not visual. It is that the strongest AI sites here removed the distance between reading about the product and using it — a prompt box instead of a button, an app instead of a homepage, real output instead of an illustration. The ones that could not do that, because they sell to banks, went the other way entirely and bought credibility with typography and named customers. Almost nobody in this set is winning on gradients.

Browse the rest of the AI category, or see how these compare with the thirty best SaaS websites across every category.

At a glance