# Dodo — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://dodo.ai/
Captured: 2026-10-11
CSS measured: 2026-10-11T03:55:39.620Z at 1440×1000 — https://dodo.ai/
Values come from computed CSS; role labels are AI judgments. Live CSS may differ from an older screenshot.
Status: AI analysed; curator review pending
Rubric: 3.2
Observer: google/gemini-3.1-pro-preview
Judge: anthropic/claude-sonnet-5

## Design direction

Dodo.ai is a software landing page presenting an AI communications agent tailored for clinics (veterinary, dental). The design employs a minimal, editorial aesthetic characterized by a very warm, off-white canvas (`#FAF8F5`) complemented by stark black text (`#231D1A`) and subtle UI borders (`#E5E2DC`). Typography is strictly SF Pro Display, using large, tight headings (up to 60px) and clean, structured body text. Layouts favor spacious, centered alignments, structured grids, and subtle, rounded, card-like containers, with key imagery demonstrating product use cases in clinic settings. The overall feel is modern, reliable, and purpose-built.

## Classification

- Industry: ai
- Site type: Landing
- Business model: AI, Software
- Styles: minimal, editorial, soft, corporate, clinical-tech
- Platform: Custom code
- Technology: Not identified

## Typography

- Display: SF Pro Display — weight 500; size 60px; line-height 60px; tracking -1.2px; Regular (100% role confidence, computed values)
- Heading: SF Pro Display — weight 500; size 48px; line-height 48px; tracking -1px; Regular (100% role confidence, computed values)
- Body: SF Pro Display — weight 400; size 16px; line-height 26px; tracking normal; Regular (90% role confidence, computed values)

## Functional palette

- Canvas — canvas #FAF8F5: color-1: computed rgb(250, 248, 245); AI role: Dominant background color (#FAF8F5) across the entire page. (100% role confidence, computed values)
- Text — text #231D1A: color-3: computed rgb(35, 29, 26); AI role: Primary text color (#231D1A) used for headings and major copy. (100% role confidence, computed values)
- Muted Text — muted text #737373: color-4: computed rgb(115, 115, 115); AI role: Secondary text color (#737373) used for navigation links and descriptive copy. (100% role confidence, computed values)
- Border — border #E5E2DC: color-12: computed rgb(229, 226, 220); AI role: Border color (#E5E2DC) used for outline buttons and card containers. (100% role confidence, computed values)
- Primary Action — primary action #231D1A: color-3: computed rgb(35, 29, 26); AI role: Solid background for primary buttons (#231D1A). (90% role confidence, computed values)

## Exact computed CSS inventory

The browser extracted these declarations from rendered DOM at capture time. They are facts, not visual guesses. Image and video pixels are outside this inventory.

### Font configurations

```json
[
  {
    "id": "font-1",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "36px",
    "lineHeight": "40px",
    "letterSpacing": "-0.7px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h2",
        "text": "Trusted by leading clinics.",
        "top": 1291,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "The Clinic Growth Engine",
        "top": 2011,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Purpose-built for clinics where every conversation matters.",
        "top": 5427,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h3",
        "text": "Analytics & Monitoring",
        "top": 4649,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Conversation Engine",
        "top": 4793,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Dodo AI Engine",
        "top": 4937,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "48px",
    "lineHeight": "48px",
    "letterSpacing": "-1px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "h2",
        "text": "Dodo doesn't just respond — it takes action in the system.",
        "top": 2985,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "An agent platform built forproduction-grade reliability.",
        "top": 4339,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "18px",
    "lineHeight": "28px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "h3",
        "text": "Veterinary Clinics",
        "top": 6002,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Dental Practices",
        "top": 6002,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "30px",
    "lineHeight": "36px",
    "letterSpacing": "-0.6px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h3",
        "text": "Fill schedules autonomously",
        "top": 2319,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "20px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 32,
    "contexts": [
      {
        "tag": "button",
        "text": "Industries",
        "top": 16,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Product",
        "top": 16,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "About",
        "top": 16,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "7px",
    "lineHeight": "10.5px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 17,
    "contexts": [
      {
        "tag": "p",
        "text": "Connected",
        "top": 4864,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Reasoning",
        "top": 4820,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Actions",
        "top": 4782,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "7px",
    "lineHeight": "10.5px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 15,
    "contexts": [
      {
        "tag": "span",
        "text": "Cornerstone",
        "top": 4852,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "ezyVet",
        "top": 4813,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Avimark",
        "top": 4775,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "20px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 9,
    "contexts": [
      {
        "tag": "a",
        "text": "Get in touch",
        "top": 16,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Listen",
        "top": 371,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Get in touch",
        "top": 371,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "button",
        "text": "Inbound",
        "top": 2167,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Analytics",
        "top": 2167,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Dodo calls and texts patients who are overdue, unconfirmed, or lapsed—turning dead time on your sche",
        "top": 2371,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "1.2px",
    "traits": "uppercase",
    "count": 7,
    "contexts": [
      {
        "tag": "p",
        "text": "Customers",
        "top": 1259,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Product",
        "top": 1979,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Integrations",
        "top": 2953,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "p",
        "text": "3/3",
        "top": 3708,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "© 2026 Dodo Inc.",
        "top": 6726,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Industries",
        "top": 6678,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "600",
    "size": "9px",
    "lineHeight": "13.5px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "1,247",
        "top": 4706,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "892",
        "top": 4674,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "94%",
        "top": 4645,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "36px",
    "lineHeight": "40px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "99.9%",
        "top": 3758,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "2 min",
        "top": 3871,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "18px",
    "lineHeight": "29.3px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "From first contact to reactivation, Dodo speaks and texts with clients.Deep PMS integrations. Truste",
        "top": 272,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Deep PMS integrations.",
        "top": 305,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-16",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "18px",
    "lineHeight": "28px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "appointments booked in 4 months for a single group",
        "top": 1343,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "of the largest veterinary emergency clinics run on Dodo",
        "top": 1447,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-17",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "24px",
    "lineHeight": "32px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Dodo supports millions of client interactions annually across practices of all sizes.",
        "top": 1339,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-18",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "26px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Dodo turns client communication into booked appointments, completed workflows, and predictive analyt",
        "top": 2067,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-19",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "400",
    "size": "6px",
    "lineHeight": "9px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Workflows",
        "top": 4930,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-20",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "20px",
    "letterSpacing": "0.4px",
    "traits": "uppercase",
    "count": 40,
    "contexts": [
      {
        "tag": "span",
        "text": "2nd Street Animal Hospital",
        "top": 1599,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "All Creatures Veterinary Hospital",
        "top": 1599,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Chowan Animal Hospital",
        "top": 1599,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-21",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "600",
    "size": "6px",
    "lineHeight": "9px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "C",
        "top": 4902,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "eV",
        "top": 4889,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Av",
        "top": 4877,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-22",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "48px",
    "lineHeight": "48px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "14k+",
        "top": 1287,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "1 in 3",
        "top": 1391,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-23",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "500",
    "size": "60px",
    "lineHeight": "60px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "AI agents that handle communications for clinics",
        "top": 122,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-24",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "700",
    "size": "8px",
    "lineHeight": "12px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "✦",
        "top": 4780,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-25",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "600",
    "size": "8px",
    "lineHeight": "12px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "Dodo AI",
        "top": 4764,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-26",
    "family": "SF Pro Display",
    "fontStack": "\"SF Pro Display\", \"SF Pro\", -apple-system, \"system-ui\", \"Segoe UI\", Roboto, sans-serif",
    "weight": "600",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "button",
        "text": "Outbound",
        "top": 2167,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#FAF8F5",
    "alpha": 1,
    "cssValue": "rgb(250, 248, 245)",
    "count": 25,
    "contexts": [
      {
        "tag": "body",
        "text": "<iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-TDKT956W\" height=\"0\" width=\"0\" style=\"d",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "IndustriesProductAboutEnterpriseSign inGet in touchAI agents that handle clinic communicationsAI age",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "header",
        "text": "IndustriesProductAboutEnterpriseSign inGet in touch",
        "top": 0,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#F2EEEB",
    "alpha": 0.30196078431372547,
    "cssValue": "rgba(241, 238, 234, 0.3)",
    "count": 3,
    "contexts": [
      {
        "tag": "section",
        "text": "CustomersTrusted by leading clinics.Dodo supports millions of client interactions annually across pr",
        "top": 1115,
        "property": "background"
      },
      {
        "tag": "footer",
        "text": "© 2026 Dodo Inc.IndustriesVeterinaryDentalProductInboundOutboundAnalyticsCompanyCareersResearchSocia",
        "top": 6622,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#231D1A",
    "alpha": 1,
    "cssValue": "rgb(35, 29, 26)",
    "count": 51,
    "contexts": [
      {
        "tag": "a",
        "text": "Get in touch",
        "top": 16,
        "property": "control-background"
      },
      {
        "tag": "span",
        "text": "AI agents that handle communications for clinics",
        "top": 122,
        "property": "text"
      },
      {
        "tag": "button",
        "text": "Listen",
        "top": 371,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#737373",
    "alpha": 1,
    "cssValue": "rgb(115, 115, 115)",
    "count": 71,
    "contexts": [
      {
        "tag": "button",
        "text": "Industries",
        "top": 16,
        "property": "text"
      },
      {
        "tag": "svg",
        "text": "",
        "top": 27,
        "property": "svg-stroke"
      },
      {
        "tag": "path",
        "text": "",
        "top": 32,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#F0F0EB",
    "alpha": 0.2,
    "cssValue": "rgba(241, 238, 234, 0.2)",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "ChannelConversationAction📞 CallBook appt for Max — wellness examBooked💬 SMSRefill request — Rimady",
        "top": 4672,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#231E19",
    "alpha": 0.2,
    "cssValue": "rgba(35, 29, 26, 0.2)",
    "count": 20,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 4820,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 4,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 4700,
        "property": "svg-fill"
      },
      {
        "tag": "line",
        "text": "",
        "top": 4789,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#737373",
    "alpha": 0.6,
    "cssValue": "rgba(115, 115, 115, 0.6)",
    "count": 40,
    "contexts": [
      {
        "tag": "span",
        "text": "2nd Street Animal Hospital",
        "top": 1599,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#F5F5F5",
    "alpha": 1,
    "cssValue": "rgb(245, 245, 245)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "✦Dodo AIConnectedCeVAvReasoningIntent · NLU · ClinicalActionsBook · Route · EscalateWorkflows",
        "top": 4700,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#767676",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(115, 115, 115, 0.1)",
    "count": 8,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 6882,
        "property": "svg-fill"
      },
      {
        "tag": "path",
        "text": "",
        "top": 6884,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#F2EEE9",
    "alpha": 0.6,
    "cssValue": "rgba(241, 238, 234, 0.6)",
    "count": 9,
    "contexts": [
      {
        "tag": "div",
        "text": "Cornerstone",
        "top": 4823,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#E5E2DC",
    "alpha": 1,
    "cssValue": "rgb(229, 226, 220)",
    "count": 75,
    "contexts": [
      {
        "tag": "header",
        "text": "IndustriesProductAboutEnterpriseSign inGet in touch",
        "top": 0,
        "property": "border"
      },
      {
        "tag": "button",
        "text": "Get in touch",
        "top": 371,
        "property": "border"
      },
      {
        "tag": "div",
        "text": "",
        "top": 2346,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#231C1B",
    "alpha": 0.6,
    "cssValue": "rgba(35, 29, 26, 0.6)",
    "count": 7,
    "contexts": [
      {
        "tag": "span",
        "text": "C",
        "top": 4902,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#241C1A",
    "alpha": 0.7019607843137254,
    "cssValue": "rgba(35, 29, 26, 0.7)",
    "count": 8,
    "contexts": [
      {
        "tag": "span",
        "text": "Recall campaigns",
        "top": 2475,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#231D1A",
    "alpha": 0.8,
    "cssValue": "rgba(35, 29, 26, 0.8)",
    "count": 4,
    "contexts": [
      {
        "tag": "h3",
        "text": "Analytics & Monitoring",
        "top": 4649,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#F0EDEB",
    "alpha": 0.4,
    "cssValue": "rgba(241, 238, 234, 0.4)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "Calls1,247",
        "top": 4699,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-17",
    "hex": "#E5E1DB",
    "alpha": 0.5019607843137255,
    "cssValue": "rgba(229, 226, 220, 0.5)",
    "count": 48,
    "contexts": [
      {
        "tag": "div",
        "text": "Cornerstone",
        "top": 4823,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-18",
    "hex": "#737373",
    "alpha": 0.4,
    "cssValue": "rgba(115, 115, 115, 0.4)",
    "count": 2,
    "contexts": [
      {
        "tag": "button",
        "text": "Inbound",
        "top": 2167,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-19",
    "hex": "#271414",
    "alpha": 0.050980392156862744,
    "cssValue": "rgba(35, 29, 26, 0.05)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "C",
        "top": 4895,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-20",
    "hex": "#737373",
    "alpha": 0.2,
    "cssValue": "rgba(115, 115, 115, 0.2)",
    "count": 80,
    "contexts": [
      {
        "tag": "span",
        "text": "",
        "top": 2207,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-21",
    "hex": "#271D1D",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(35, 29, 26, 0.1)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "✦",
        "top": 4777,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-22",
    "hex": "#231E19",
    "alpha": 0.4,
    "cssValue": "rgba(35, 29, 26, 0.4)",
    "count": 8,
    "contexts": [
      {
        "tag": "span",
        "text": "",
        "top": 2493,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "",
        "top": 4635,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-23",
    "hex": "#E5E1DB",
    "alpha": 0.30196078431372547,
    "cssValue": "rgba(229, 226, 220, 0.3)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "ChannelConversationAction",
        "top": 4679,
        "property": "border"
      }
    ]
  }
]
```

### Extraction limits

- Font families are computed CSS declarations, not optical font identification.
- Colors are computed CSS converted by the browser to sRGB; image/video pixels and gradient stops are not sampled.
- Transparent colors are recorded with alpha but excluded from opaque palette role assignments.
- Only currently rendered DOM elements are sampled; closed shadow roots and iframe contents are excluded.

## Type, spacing, and shape language

- Spacing rhythm: Generous vertical spacing between major sections, with tighter clustering of text within grid items and cards.
- Corner style: Consistent rounded corners on buttons, floating cards, and feature containers, providing a soft aesthetic.
- Radius: Visibly rounded borders on buttons and cards, likely between 8px and 24px.
- Borders: Subtle, solid, 1px borders (#E5E2DC) on outline buttons, cards, and input/stat blocks.
- Buttons: Pill-shaped or rounded-rectangle buttons. Primary buttons are solid dark (#231D1A); secondary buttons have subtle outlines (#E5E2DC) on canvas.
- Content width: Centered, max-width container, likely around 1200px, with generous side margins.
- Density: Low density. High reliance on whitespace to isolate headings and focus attention on product imagery.
- Evidence: Observation of consistent padding/margins in crops, measured border colors, button shapes in DOM, and overall page structure.

## Sections

Gallery section count: 8. Each entry corresponds to one gallery capture.

1. **Hero — AI Agents for Clinic Communications Hero** (Home)
   AI suggestion (97% confidence): Complete page-opening hero with navigation, clear value proposition, dual CTAs, and a large branded clinic visual.
   Capture: 1440×1095px; page bounds 0–1095px of 7106px; source section ID: `7f7caf5b-9c32-4225-90d4-a370c35670b0`; image: https://media.designdetails.io/library/02674e5a3c3b02a7a74e82e6a03b8b5eab23d0449a129bde44da18fb30bf9c2f/7f7caf5b-9c32-4225-90d4-a370c35670b0.webp
   SECTION.md v3.2: `7f7caf5b-9c32-4225-90d4-a370c35670b0` (deterministic evidence; editorial review pending)
2. **Features — The Clinic Growth Engine** (Home)
   Reusable feature composition from Home, organized around “The Clinic Growth Engine”.
   Capture: 1440×974px; page bounds 1835–2809px of 7106px; source section ID: `690e36b0-0c1d-4a23-89ad-f9e75eadcd44`; image: https://media.designdetails.io/library/2c5d43caf87b693e5fe49b205eb96939e331d44781138e5e01e78cdb06bc49a1/section_crop-690e36b0-2026-10-11T03-55-52-549Z.webp
   SECTION.md v3.2: `690e36b0-0c1d-4a23-89ad-f9e75eadcd44` (deterministic evidence; editorial review pending)
3. **Features — Let's chat!** (Home)
   Reusable feature composition from Home, organized around “Let's chat!”.
   Capture: 1440×404px; page bounds 6218–6622px of 7106px; source section ID: `f3aa8d0a-299a-4072-b3f1-303568cbb2eb`; image: https://media.designdetails.io/library/8507d54c575d96e6f877020d84fc53d401b0d4e16c1e93327fbe807c0a0d011f/section_crop-f3aa8d0a-2026-10-11T03-55-56-226Z.webp
   SECTION.md v3.2: `f3aa8d0a-299a-4072-b3f1-303568cbb2eb` (deterministic evidence; editorial review pending)
4. **Stats — Trusted by Leading Clinics** (Home)
   AI suggestion (91% confidence): Self-contained customer-proof section combining an introductory statement, prominent adoption metrics, and a broad row of clinic names.
   Capture: 1440×558px; page bounds 1194–1752px of 7106px; source section ID: `dbaa0df6-f509-47f2-870b-3746f9d59550`; image: https://media.designdetails.io/library/52c8f5b211b9f90f254c2bdea449cf365d4b08ec0396c475790b107de4ada74e/dbaa0df6-f509-47f2-870b-3746f9d59550.webp
   SECTION.md v3.2: `dbaa0df6-f509-47f2-870b-3746f9d59550` (deterministic evidence; editorial review pending)
5. **Feature Grid — Practice Management Integrations** (Home)
   AI suggestion (97% confidence): Complete integrations section with a clear heading, deep-integration benefit panel, supported-system logos, and operational stats arranged as a cohesive reusable grid.
   Capture: 1440×1152px; page bounds 2948–4100px of 7106px; source section ID: `2344835f-ef8a-4738-b477-45ec8f54ff46`; image: https://media.designdetails.io/library/4c9ec79cd33c355ae6beee73db9fcb5b63f56463c5c8b1626bf6edfac496b30f/2344835f-ef8a-4738-b477-45ec8f54ff46.webp
   SECTION.md v3.2: `2344835f-ef8a-4738-b477-45ec8f54ff46` (deterministic evidence; editorial review pending)
6. **Other — Production-Grade Agent Architecture** (Home)
   AI-proposed category: architecture-diagram
AI suggestion (95% confidence): Self-contained architecture explainer combining a section heading, central layered platform diagram, and four labeled system components; it has a clear beginning and ending before the Industries section.
   Capture: 1440×993px; page bounds 4256–5249px of 7106px; source section ID: `1316b48f-5692-4104-9743-67330d3a6b1d`; image: https://media.designdetails.io/library/b3efe9250c1327e8090b922a917b79a637859d1b60bc666e8edffe77198a7ba8/1316b48f-5692-4104-9743-67330d3a6b1d.webp
   SECTION.md v3.2: `1316b48f-5692-4104-9743-67330d3a6b1d` (deterministic evidence; editorial review pending)
7. **Other — Purpose-Built Clinic Industries** (Home)
   AI-proposed category: industry-grid
AI suggestion (96% confidence): Complete industry showcase with heading, supporting copy, and a finished two-card grid for veterinary and dental clinics.
   Capture: 1440×693px; page bounds 5389–6082px of 7106px; source section ID: `2c4211cf-7579-40c3-a86e-b19ab4843e23`; image: https://media.designdetails.io/library/0aae4a5fdcb0c5003e1e593ba05c9cdd23edb9e7555192ed3ef42f5429ef232f/2c4211cf-7579-40c3-a86e-b19ab4843e23.webp
   SECTION.md v3.2: `2c4211cf-7579-40c3-a86e-b19ab4843e23` (deterministic evidence; editorial review pending)
8. **Footer — Dodo Multi-Column Footer** (Home)
   AI suggestion (98% confidence): Complete page footer with brand mark, copyright, grouped navigation links, social/legal columns, and distinctive oversized wordmark.
   Capture: 1440×476px; page bounds 6630–7106px of 7106px; source section ID: `4336eb2f-782a-4fea-a707-3270d66a2ab8`; image: https://media.designdetails.io/library/fb50ef253fb54ac3ab4171f2d1898e1a833a8e40ab9f94b3a3d465035fa50c43/4336eb2f-782a-4fea-a707-3270d66a2ab8.webp
   SECTION.md v3.2: `4336eb2f-782a-4fea-a707-3270d66a2ab8` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://media.designdetails.io/library/74e30d8214b0bf60b8a4b4fda3272193ebf51eefd913520a6c4bb254a105a43a/desktop_full-11dcad8f-2026-10-11T03-55-39-632Z.webp
- Mobile screenshot: https://media.designdetails.io/library/6244317e5d1d34d5a1b65d3bc041943db9bf1d3972e569bb6a04dc258de91dcf/mobile_full-11dcad8f-2026-10-11T03-56-21-071Z.webp
- Open Graph image: https://media.designdetails.io/library/b34f30e156f1e2db442d3d58e521549fc2a41c85c20807c368c58004118e6469/og_image-11dcad8f-2026-10-11T03-55-49-088Z.webp
- Full-page video: https://media.designdetails.io/library/dfe58fc4a59111c95eccd55885949063d3ec235d011144b809128dbc69227db9/motion-1791702761712.mp4
- Video poster: https://media.designdetails.io/library/e9b563a559567fb2b8848eb439434a79f7ea7e72b838e514b941302cacea7aee/motion-poster-1791702761712.webp
- Motion status: Recording attached. Consult the motion score and section motion records; do not infer exact easing from frames alone.

## Implementation contract

- Treat computed CSS values, screenshot dimensions, and section bounds as measured evidence.
- Treat typography roles, palette roles, style labels, quality scores, and prose analysis as model or curator judgments.
- Rebuild the page in the listed section order. Request SECTION.md v3.2 using the listed ID. Promoted IDs include editorial observation and judgment; raw gallery IDs still return deterministic geometry, site design facts, media treatment, and explicit evidence gaps.
- Do not invent exact responsive behavior, motion curves, or hidden interaction states when they were not captured.

## Reusable components

- Navigation Bar
- Hero
- Primary Button
- Outline Button
- Stat Block
- Logo Strip
- Tabs
- Feature Card
- CTA
- Footer
- Interactive Software Mockup

## Quality rubric

Overall: 48.2/100 (Serviceable)
Evidence coverage: 100%
Judge tier: Competent
Verdict: Dodo.ai is a cleanly executed, vertical-tailored SaaS landing page that applies a warm-neutral, single-typeface design system with discipline and ties its copy and imagery convincingly to the clinic-communications use case. However, its palette, layout grammar, component inventory, and motion patterns (timed carousels, tab indicators) closely replicate a widely repeated contemporary AI-agent SaaS template, leaving originality as the clear weak point and keeping the overall experience at a competent, professional-but-unremarkable level rather than a distinctive one.

- Typography (15%): 59 — A single family (SF Pro Display) is used across the entire hierarchy with tight, consistent tracking (-1.2px on display sizes) and a clear size ladder from 60px hero down to 12px micro-labels, giving the page a coherent, legible system. However, this is the now-standard 'tight SF Pro Display SaaS' treatment seen across many AI-product sites, with no distinctive pairing, optical texture, or expressive display choice beyond scale and weight.
- Color (10%): 57 — The palette is tightly restrained — a warm off-white canvas (#FAF8F5), near-black text (#231D1A), and a single muted grey/border tone (#E5E2DC, #737373) — applied with discipline across buttons, cards, and backgrounds. This produces a calm, cohesive surface, but the near-monochrome approach offers no distinguishing accent or brand hue, making it visually interchangeable with many other 'warm neutral SaaS' sites.
- Layout (20%): 58 — The page follows a conventional, well-executed SaaS marketing template: centered hero, logo strip, stat block, tabbed product demo, integration diagram, stacked-card architecture graphic, two-up industry cards, centered CTA, multi-column footer. Spacing and alignment are consistent and the structure reads cleanly at each breakpoint sampled, but every section type is a recognizable off-the-shelf pattern with no asymmetry, grid-breaking, or structural surprise.
- Motion (20%): 45 — Frames show auto-advancing carousels (Supported Systems rotating 1/3→2/3→3/3) and a tab indicator progressing along a dotted track for Inbound/Outbound/Analytics, plus a scrolling logo strip — evidence of a basic timed-rotation motion system applied in multiple places. No evidence establishes smoothness, easing quality, or more sophisticated choreography (e.g., scroll-linked reveals, parallax, or physically-motivated transitions); only state changes between captured frames are visible.
- Originality (25%): 27 — The overall concept, palette, typography treatment, section sequence (hero → logo strip → stat block → tabbed feature demo → integration/architecture diagram → vertical cards → CTA → footer), and visual motifs (stacked translucent cards for 'architecture', rounded outline buttons, uppercase eyebrow labels) closely match a widely repeated template now common across AI-agent and dev-tool SaaS landing pages. Nothing here — not the palette, not the layout grammar, not the component set — introduces a structural or conceptual idea that couldn't be swapped onto another company's site with a logo change.
- Content (10%): 63 — Copy and imagery are clearly tailored to the clinic vertical — named PMS integrations (Vetspire, Dentrix, Eaglesoft, Provet Cloud, ezyVet, Cornerstone, Avimark), named customer clinics, and photography of real reception/exam-room settings reinforce the product's specific audience rather than generic stock software imagery. Stats (14k+, 1 in 3, 99.9%, 2 min) are concrete and vertical-specific.

Coverage: 100% of the current weighted rubric. Compare overall scores only at similar evidence coverage.

Formula: weighted mean of scored axes — Typography 15%, Color 10%, Layout 20%, Motion 20%, Originality 25%, Content 10%. Inconclusive and not-assessed axes are excluded and coverage is shown explicitly.

## Verification checklist

- [x] Score evidence
- [x] Design tokens
- [ ] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

A warm reception photo under the headline grounds an AI product in a real clinic setting, while a cream and brown palette keeps the mood calm and trustworthy. Big bold stat numbers and short labelled sections pace the long page into digestible chapters that are easy to scan for proof points.

## Usage guidance

Use this record as design evidence. Combine it with other references and create an original implementation; do not reproduce the source website or its proprietary copy and assets.