Skip to content

Zaro

zaro.ai/

Zaro builds a continuously updated "knowledge layer" of a business's own data for AI systems to query, arguing that static data warehouses and knowledge graphs go stale — its opening line is "You have already bought the AI. It cannot read your business." It claims 99% data currency versus 41% for traditional knowledge graphs, and states every answer is traceable back to a source file with version history. The page runs a direct side-by-side comparison against knowledge graphs rather than listing generic features, and cites its team's academic pedigree (Imperial College, Cambridge, Oxford) and Cherry Ventures backing as its main credibility markers, alongside integration logos for Salesforce, Snowflake, and Databricks.

Category
Productivity & Collaboration
Style
LightMinimal
Stack
Tailwind CSS
Fonts
SaansJetBrains Mono
Palette
Meta title
Zaro | Make your company AI-ready
Sections
5
Updated

Zaro's landing page, section by section

Each section below is cropped straight from Zaro's live page — useful references for productivity & collaboration landing page design.

Zaro design review: how the homepage is built

The Zaro homepage is a long scroll of about 9,937 pixels: a hero with a prompt box, a tabbed system diagram, three feature cards, a dark security panel, a four-step walkthrough, a before-and-after comparison, a memory diagram, a closing band and a footer. Colour stays near-neutral across the whole page, with #fafaf8 and #e4e2dc backgrounds, grey #827c7a text and a lilac #bdb4f8 accent on buttons and the closing headline. Headlines use the Saans typeface, with JetBrains Mono for labels. A pixel-dot motif repeats from the hero margins to the lock illustration and the closing band.

Above the fold

A floating white navigation bar holds the logo, "Product" and "Solutions" dropdowns, "Security", "Blog", "Sign in" and a black "Contact us" button. The headline reads "AI Transformation in a Box", the second line in lighter grey. A lilac "Contact us" button sits above a prompt box with dashed-outline tokens for "Spreadsheet", "Revenue Dashboard App" and "Agent" plus app icons. A strip labelled "BUILT BY THE TEAM FROM" and "BACKED BY" follows.

Tabbed system diagram and feature cards

A grey section opens with "Stop wiring up tools. Run one connected system." and eight tabs from "Ops" to "Risk & Compliance". The active tab fills a large white card: four data-source chips ("Gmail", "Slack", "HRIS Export", "Google Drive") connect by lines to a browser mockup, with four agents on the left and a feed on the right. Next, "One workspace. Three things." introduces three side-by-side cards, starting with "Your context, captured."

Security panel and four-step walkthrough

A dark rounded panel carries the label "SECURITY & GOVERNANCE", the headline "Governed from the layer where AI works." and a pale blue "Explore Security" button, beside a pixelated padlock on a grid. A walkthrough titled "From scattered context to a workspace that runs itself." then alternates text and screenshot cards: "Create your workspace.", "Connect your data.", "Run agents on it." and "Generate what you need."

Comparison, memory diagram and footer

"The market sells each piece separately. Zaro closes the loop." leads into five paired rows ("MEMORY", "OWNERSHIP", "APPLICATIONS", "RELIABILITY", "COST"), a grey "Before Zaro" card against a white "With Zaro" card. A four-quadrant diagram around a central logo follows. The closing band has "Your company's intelligence should belong to your company.", a "Contact us" button and "GDPR COMPLIANT". The dark footer has a large logo, four link columns and six legal links.

On mobile

At 390px the length grows to about 12,288 pixels. The navigation bar is absent from the capture and the hero prompt box narrows to a compact card. Tabs wrap into rows, the Ops diagram reduces to one column, and the three feature cards stack. Each before-and-after pair stacks vertically with the grey card first. The memory diagram shrinks to a thumbnail, and the footer links form two columns.

Worth borrowing

  • A prompt box with dashed, colour-coded tokens shows the product's input style directly in the hero.
  • Eight category tabs over one diagram let a single section speak to many departments.
  • Grey "Before Zaro" cards paired with white "With Zaro" cards make a comparison readable by tone alone.
Keystroke landing page design
Keystroke
Productivity & Collaborationkeystroke.ai/
Eigenpal landing page design
Eigenpal
Productivity & Collaborationeigenpal.com/
Wisprflow landing page design
Wisprflow
Productivity & Collaborationwisprflow.ai/
Runner landing page design
Runner
Productivity & Collaborationrunner.now/
Getmagicform landing page design
Getmagicform
Productivity & Collaborationgetmagicform.com/
Clickup landing page design
Clickup
Productivity & Collaborationclickup.com/