Skip to content
BetaFree MCP server

Convex

convex.dev/

Convex is a backend platform bundling a database, serverless functions, real-time sync, search, and file storage into one TypeScript stack, pitched under the line 'All gas, no breakages.' It leans on ACID transactions and end-to-end type safety as guardrails specifically framed around AI-generated code — the copy claims this catches 'agent hallucinations before they ship.' The homepage names its customers directly rather than using a logo wall alone (OpenAI, Tripadvisor, Solana, Zapier among them) and pairs that with founder credentials: CEO Jamie Turner previously led engineering at Dropbox, and CTO James Cowling was a Dropbox principal engineer with an MIT PhD under Barbara Liskov, used as direct proof of the team's distributed-systems background.

Category
Engineering & Infrastructure
Style
DarkColorful
Stack
Next.jsTailwind CSS
Fonts
neue-haas-grotesk-displayvcrgtAmericaArchivo
Palette
Meta title
Convex | All gas, no breakages
Sections
7
Updated

Convex's landing page, section by section

Each section below is cropped straight from Convex's live page — useful references for engineering & infrastructure landing page design.

Convex design review: how the homepage is built

The page runs top to bottom as a dark hero, a cream logo strip, a cream checklist, a dark product section, an olive testimonial band and a red enterprise bar, then a dark footer. At 1440px wide it is 4,570 pixels tall. Colour sits on near-black, with cream #f4dcb4 for light bands and yellow, red and purple stripes #f8b81b, #f2362c and #882379 sweeping out of the hero. Typefaces are neue-haas-grotesk-display and vcr for display, with gtAmerica and Archivo for body text. A copyable terminal command repeats in the hero, the product section and the closing band.

Above the fold

The hero is set on near-black with the headline "ALL GAS NO BREAKAGES", then two pill buttons, "Read the docs" and "Start building". To its right sits a dark card with three blocks: "Copy a prompt to get your agent set up", "npm create convex@latest" and "Build a multiplayer YouTube app". Yellow, red and purple stripes sweep out beneath the card, and partner logos follow in a cream strip.

Solved checklist and proof line

A cream section headed "Solved." follows the logos, with four checked rows: "ACID transactions", "End-to-end type safety", "Automatic caching & scaling" and "Real-time sync", each followed by a plain-language benefit. A pale grid with a few shaded cells fills the right half, and a dark button reads "Here's the proof". The section ends on the line "Convex is better than your stack."

Agent components, integrations and quote

A dark section headed "Ready for agentic workloads (and everything else)" holds three cards, each with an npm install command. The cards read "Fan out work, on a managed pool", "Workflows that survive anything" and "Build AI agents". Five tiles name Stripe, Resend, Twilio, WorkOS and PostHog, followed by "Browse the full library". An olive band carries "Convex lets me build at the speed of AI.", attributed to Thomas Forrest.

Closing section and footer

Two testimonial cards from Sean Rich and Karan Singhal sit above a founders block with bios for Jamie Turner and James Cowling. A red strip offers "Convex for Enterprise" beside compliance labels: SOC 2 Type II, HIPAA, RBAC and SSO. The closing band reads "Build a production app this afternoon" with an orange "Start building" button. The footer has four link columns and a trust list.

On mobile

At 390px the page stacks into one column, 6,525 pixels tall. The buttons move under the terminal cards, with "Start building" above "Read the docs" as full-width rows. The checklist and the three agent cards become single-column stacks, and the integration tiles wrap into rows of three and two. The footer collapses into one long link list, with Product and Developers sitting side by side.

Worth borrowing

  • Repeat one copyable command, such as "npm create convex@latest", through the hero and closing band.
  • Pair a short checklist with a single proof button, as the Solved section does with "Here's the proof".
  • Close a long page with a founders block of photographed bios above a red enterprise strip.
Tester landing page design
Tester
Engineering & Infrastructuretester.army/
Retool landing page design
Retool
Engineering & Infrastructureretool.com/
Inngest landing page design
Inngest
Engineering & Infrastructureinngest.com/
Liveblocks landing page design
Liveblocks
Engineering & Infrastructureliveblocks.io/
Assurestor landing page design
Assurestor
Engineering & Infrastructureassurestor.com/
Kiro landing page design
Kiro
Engineering & Infrastructurekiro.dev/