# aethr — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://getaethr.ai/
Captured: 2026-10-23
CSS measured: 2026-10-23T18:32:10.359Z at 1440×1000 — https://getaethr.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

The website features a sophisticated, dark-themed design with a strong typographic hierarchy, pairing an elegant serif for large display headings with a clean sans-serif for body copy, and monospace fonts for technical annotations. The visual language relies heavily on abstract, fine-line network diagrams and data visualizations rendered in subtle teal tones against deep charcoal backgrounds, creating a high-tech, infrastructural aesthetic. Layouts are spacious and organized, utilizing bento-style cards and wide margins.

## Classification

- Industry: ai
- Site type: Landing
- Business model: Software
- Styles: minimal, typographic, corporate, dark-theme, technical
- Platform: Framer
- Technology: Not identified

## Typography

- Display: PP Eiko Light — weight 300; size 72px; line-height 72px; tracking -2.9px; Regular (100% role confidence, computed values)
- Heading: Switzer — weight 400; size 30px; line-height 33px; tracking -0.3px; Regular (90% role confidence, computed values)
- Body: Switzer — weight 400; size 14px; line-height 21px; tracking normal; Regular (95% role confidence, computed values)
- Mono: Geist Mono — weight 400; size 12px; line-height 12px; tracking normal; Regular (90% role confidence, computed values)

## Functional palette

- Text — text #FFFFFF: color-5: computed rgb(255, 255, 255); AI role: White (#FFFFFF) used for high-contrast primary headings and titles. (100% role confidence, computed values)
- Canvas — canvas #282B2B: color-3: computed rgb(40, 43, 43); AI role: Main dark background color (#282B2B) applied to the body and large sections. (95% role confidence, computed values)
- Muted Text — muted text #A0A3A2: color-7: computed rgb(160, 163, 162); AI role: Light gray (#A0A3A2) used extensively for body paragraphs and secondary text. (95% role confidence, computed values)
- Primary Action — primary action #CEC7BF: color-11: computed rgb(206, 199, 191); AI role: Light beige/gray (#CEC7BF) used specifically for the primary 'Get in touch' CTA buttons. (95% role confidence, computed values)
- Surface — surface #222525: color-4: computed rgb(34, 37, 37); AI role: Slightly varied dark gray (#222525) used for bento card backgrounds. (90% role confidence, computed values)
- Accent — accent #5F9496: color-12: computed rgb(95, 148, 150); AI role: Muted teal (#5F9496) used for data visualization bars and small iconic elements. (85% role confidence, computed values)
- Border — border #677273: color-6: computed rgb(103, 114, 115); AI role: Subtle gray (#677273) used for thin dividing lines and card borders. (80% 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": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "400",
    "size": "28px",
    "lineHeight": "33.6px",
    "letterSpacing": "-0.6px",
    "traits": "Regular",
    "count": 32,
    "contexts": [
      {
        "tag": "h3",
        "text": "Map",
        "top": 3831,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Traversal",
        "top": 3831,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Evidence",
        "top": 3831,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "400",
    "size": "30px",
    "lineHeight": "33px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "h3",
        "text": "A Network, Emerging",
        "top": 3038,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "The Breakthrough Is Algorithmic",
        "top": 3038,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "Unification of a Fractured System",
        "top": 3460,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "PP Eiko Light",
    "fontStack": "\"PP Eiko Light\", \"PP Eiko Light Placeholder\", sans-serif",
    "weight": "300",
    "size": "72px",
    "lineHeight": "72px",
    "letterSpacing": "-2.9px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h1",
        "text": "The Network for the Agent Economy",
        "top": 120,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "PP Eiko Light",
    "fontStack": "\"PP Eiko Light\", \"PP Eiko Light Placeholder\", sans-serif",
    "weight": "300",
    "size": "72px",
    "lineHeight": "72px",
    "letterSpacing": "-1.4px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h2",
        "text": "The Network for the Agent Economy",
        "top": 4010,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "21px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 11,
    "contexts": [
      {
        "tag": "p",
        "text": "Ask, and aethr computes over its map of every agent you can reach: internal, open source, third part",
        "top": 1895,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "You or your agent picks from the shortlist. The pick is the permission. aethr carries the task to th",
        "top": 1905,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "An agent's card is a claim. The record tracks what agents actually do, so results are calibrated by ",
        "top": 2845,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "21px",
    "letterSpacing": "0.3px",
    "traits": "Regular",
    "count": 9,
    "contexts": [
      {
        "tag": "p",
        "text": "Get in touch",
        "top": 21,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "How It Works",
        "top": 1787,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Exposing the Map",
        "top": 1870,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "14px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 6,
    "contexts": [
      {
        "tag": "p",
        "text": "Home",
        "top": 24,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Home",
        "top": 64,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Product",
        "top": 24,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "500",
    "size": "18px",
    "lineHeight": "27px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "p",
        "text": "aethr maps the entire agentic ecosystem, every agent across every surface, into one network. Every a",
        "top": 705,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Connecting computers created the internet. Connecting people created social networks. Connecting age",
        "top": 3083,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Connecting agents at scale is a distributed systems problem, not an AI guessing game. aethr solves i",
        "top": 3081,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "500",
    "size": "16px",
    "lineHeight": "19.2px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "Get in touch",
        "top": 823,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Get in touch",
        "top": 3639,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Get in touch",
        "top": 4101,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "PP Eiko Regular",
    "fontStack": "\"PP Eiko Regular\", \"PP Eiko Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "25px",
    "lineHeight": "30px",
    "letterSpacing": "-1px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "aethr",
        "top": 16,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "aethr",
        "top": 4292,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "Switzer",
    "fontStack": "Switzer, \"Switzer Placeholder\", sans-serif",
    "weight": "500",
    "size": "20px",
    "lineHeight": "30px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 267,
    "contexts": [
      {
        "tag": "span",
        "text": "A",
        "top": 1267,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "g",
        "top": 1267,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "e",
        "top": 1267,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "PP Eiko Light",
    "fontStack": "\"PP Eiko Light\", \"PP Eiko Light Placeholder\", sans-serif",
    "weight": "300",
    "size": "52px",
    "lineHeight": "52px",
    "letterSpacing": "-0.5px",
    "traits": "Regular",
    "count": 24,
    "contexts": [
      {
        "tag": "span",
        "text": "Search",
        "top": 1832,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Exposes",
        "top": 1832,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "the",
        "top": 1832,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "Geist Mono",
    "fontStack": "\"Geist Mono\", monospace",
    "weight": "400",
    "size": "12px",
    "lineHeight": "12px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "span",
        "text": "agents",
        "top": 2124,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "models",
        "top": 2124,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "tools",
        "top": 2124,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "PP Eiko Light",
    "fontStack": "\"PP Eiko Light\", \"PP Eiko Light Placeholder\", sans-serif",
    "weight": "300",
    "size": "80px",
    "lineHeight": "80px",
    "letterSpacing": "-3.2px",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "span",
        "text": "Fragmentation",
        "top": 1129,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Is",
        "top": 1129,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "How",
        "top": 1129,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "Geist Mono",
    "fontStack": "\"Geist Mono\", monospace",
    "weight": "700",
    "size": "12px",
    "lineHeight": "12px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "aethr",
        "top": 2304,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-16",
    "family": "Sora",
    "fontStack": "Sora, \"Sora Placeholder\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "21px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "Assembly by Luca™",
        "top": 4476,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 145,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 822,
        "property": "svg-fill"
      },
      {
        "tag": "use",
        "text": "",
        "top": 830,
        "property": "svg-fill"
      },
      {
        "tag": "g",
        "text": "",
        "top": -90,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#424746",
    "alpha": 1,
    "cssValue": "rgb(66, 71, 70)",
    "count": 6,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": -90,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#282B2B",
    "alpha": 1,
    "cssValue": "rgb(40, 43, 43)",
    "count": 15,
    "contexts": [
      {
        "tag": "body",
        "text": ":root body { background: var(--token-f557de12-b8d7-42e2-9783-5f6614d24c34, rgb(53, 65, 62)); }aethrH",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "aethrHomeHomeProductProductCompanyCompanyGet in touchhtml body { background: var(--token-c9496ede-41",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "p",
        "text": "Get in touch",
        "top": 823,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#222525",
    "alpha": 1,
    "cssValue": "rgb(34, 37, 37)",
    "count": 11,
    "contexts": [
      {
        "tag": "section",
        "text": "The Network for the Agent Economyaethr maps the entire agentic ecosystem, every agent across every s",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "",
        "top": 921,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#FFFFFF",
    "alpha": 1,
    "cssValue": "rgb(255, 255, 255)",
    "count": 66,
    "contexts": [
      {
        "tag": "p",
        "text": "aethr",
        "top": 16,
        "property": "text"
      },
      {
        "tag": "h1",
        "text": "The Network for the Agent Economy",
        "top": 120,
        "property": "text"
      },
      {
        "tag": "span",
        "text": "Fragmentation",
        "top": 1129,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#677273",
    "alpha": 1,
    "cssValue": "rgb(103, 114, 115)",
    "count": 8,
    "contexts": [
      {
        "tag": "line",
        "text": "",
        "top": 2135,
        "property": "svg-stroke"
      },
      {
        "tag": "div",
        "text": "aethr",
        "top": 2286,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#A0A3A2",
    "alpha": 1,
    "cssValue": "rgb(160, 163, 162)",
    "count": 284,
    "contexts": [
      {
        "tag": "span",
        "text": "A",
        "top": 1267,
        "property": "text"
      },
      {
        "tag": "p",
        "text": "How It Works",
        "top": 1787,
        "property": "text"
      },
      {
        "tag": "a",
        "text": "Assembly by Luca™",
        "top": 4476,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#D2D9D7",
    "alpha": 1,
    "cssValue": "rgb(210, 217, 215)",
    "count": 32,
    "contexts": [
      {
        "tag": "h3",
        "text": "Map",
        "top": 3831,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#272A2A",
    "alpha": 0.30980392156862746,
    "cssValue": "rgba(40, 43, 43, 0.31)",
    "count": 1,
    "contexts": [
      {
        "tag": "nav",
        "text": "aethrHomeHomeProductProductCompanyCompanyGet in touch",
        "top": 0,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#B8B8B8",
    "alpha": 1,
    "cssValue": "rgb(184, 184, 184)",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "aethr maps the entire agentic ecosystem, every agent across every surface, into one network. Every a",
        "top": 705,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#CEC7BF",
    "alpha": 1,
    "cssValue": "rgb(206, 199, 191)",
    "count": 3,
    "contexts": [
      {
        "tag": "a",
        "text": "Get in touch",
        "top": 810,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#5F9496",
    "alpha": 1,
    "cssValue": "rgb(95, 148, 150)",
    "count": 62,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 3654,
        "property": "background"
      },
      {
        "tag": "path",
        "text": "",
        "top": 1011,
        "property": "svg-fill"
      },
      {
        "tag": "path",
        "text": "",
        "top": 1039,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#3D4C4D",
    "alpha": 1,
    "cssValue": "rgb(61, 76, 77)",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "Get in touch",
        "top": 12,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#424747",
    "alpha": 1,
    "cssValue": "rgb(66, 71, 71)",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 920,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#596B67",
    "alpha": 1,
    "cssValue": "rgb(89, 107, 103)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 4252,
        "property": "background"
      },
      {
        "tag": "path",
        "text": "",
        "top": 1025,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#9BD2D4",
    "alpha": 1,
    "cssValue": "rgb(155, 210, 212)",
    "count": 1,
    "contexts": [
      {
        "tag": "path",
        "text": "",
        "top": 1053,
        "property": "svg-stroke"
      }
    ]
  }
]
```

### 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: Large, breathable margins between distinct page sections, with tighter, consistent padding inside bento-style cards.
- Corner style: Rounded corners are prominent on interactive elements and container modules.
- Radius: Buttons feature a fully rounded, pill-like radius. Feature cards use a subtle border radius (likely 8-12px).
- Borders: Extremely subtle, thin (1px) borders are used to outline bento cards and separate sections without creating heavy visual weight.
- Buttons: Solid background fill contrasting with the dark theme, pill shape, with dark text.
- Content width: Content is constrained to a central column, leaving distinct horizontal margins on desktop.
- Density: Low visual density; relies on negative space to draw focus to typography and fine-line graphics.
- Evidence: Observed via the bento layout cards, pill-shaped 'Get in touch' buttons, and the expansive dark background between text blocks.

## Sections

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

1. **Hero — Agent Economy Network Hero** (Home)
   AI suggestion (98% confidence): Complete page-opening hero with brand navigation, a large value proposition, network-line artwork, supporting copy, and a clear contact CTA.
   Capture: 1440×921px; page bounds 0–921px of 4520px; source section ID: `b016598d-4136-4451-9197-9f81c325f07a`; image: https://media.designdetails.io/library/65e152c8305d105443d7dfc3a059b2db5cf18abc8c3bd6b27f282ce3874be66a/b016598d-4136-4451-9197-9f81c325f07a.webp
   SECTION.md v3.2: `b016598d-4136-4451-9197-9f81c325f07a` (deterministic evidence; editorial review pending)
2. **Footer — The Network for the Agent Economy** (Home)
   Closing footer and call-to-action from Home, organized around “The Network for the Agent Economy”.
   Capture: 1440×590px; page bounds 3930–4520px of 4520px; source section ID: `8559337b-faf7-4aba-aaff-aff8fbb1e86a`; image: https://media.designdetails.io/library/d98a8d1adcf3ca568d2326debe7bf0de6f7d09976182f6ea9ae98c9199fab0b0/section_crop-8559337b-2026-10-23T18-32-22-863Z.webp
   SECTION.md v3.2: `8559337b-faf7-4aba-aaff-aff8fbb1e86a` (deterministic evidence; editorial review pending)
3. **Process — Search, Routing, and Record Workflow** (Home)
   AI suggestion (94% confidence): Complete “How It Works” section combining a three-step headline, explanatory callouts, and a substantial network-routing diagram; the next “Impact” section clearly begins below it.
   Capture: 1440×888px; page bounds 1728–2616px of 4520px; source section ID: `852a5225-0568-4cca-9a42-dcc2a9534650`; image: https://media.designdetails.io/library/9c5f8acdcddb91faa1edb9f708a70acf8361837df4a18f9841eacad64e0b85d4/852a5225-0568-4cca-9a42-dcc2a9534650.webp
   SECTION.md v3.2: `852a5225-0568-4cca-9a42-dcc2a9534650` (deterministic evidence; editorial review pending)
4. **Feature Grid — Solved Network Problem Feature Grid** (Home)
   AI suggestion (96% confidence): Complete dark feature section with an impact label, major editorial heading, supporting neutrality note, and a cohesive three-card grid combining explanation, data visualization, system diagram, and CTA.
   Capture: 1440×1018px; page bounds 2692–3710px of 4520px; source section ID: `6e0e7a0a-1e14-4d3e-bddb-a8d6d4d8373c`; image: https://media.designdetails.io/library/208021fd2393582576e7aaccb4f97e01d3fb34d733e605625916571d91ee74fe/6e0e7a0a-1e14-4d3e-bddb-a8d6d4d8373c.webp
   SECTION.md v3.2: `6e0e7a0a-1e14-4d3e-bddb-a8d6d4d8373c` (deterministic evidence; editorial review pending)
5. **CTA — The Network for the Agent Economy CTA** (Home)
   AI suggestion (93% confidence): Self-contained conversion section with a prominent headline, concise value statement, and full-width contact button, bounded by the decorative band above and footer divider below.
   Capture: 1440×296px; page bounds 3948–4244px of 4520px; source section ID: `4406ba81-b0af-46e6-bd1d-4048857d36ad`; image: https://media.designdetails.io/library/950fd629a1e2a9e202c881b2dd1f615a6b1cbefc29fe1657bace166fcef8309f/4406ba81-b0af-46e6-bd1d-4048857d36ad.webp
   SECTION.md v3.2: `4406ba81-b0af-46e6-bd1d-4048857d36ad` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://media.designdetails.io/library/c0aaae0f04ee00c201db79b67d4765ee682afc51b296e14fbe3b7b3846e52e3f/desktop_full-1505322f-2026-10-23T18-32-10-372Z.webp
- Mobile screenshot: https://media.designdetails.io/library/20e1e45ea0dab39f3d44de52d569634367ddf9957369c75863909a6b6e04930a/mobile_full-1505322f-2026-10-23T18-32-37-792Z.webp
- Open Graph image: https://media.designdetails.io/library/50bfd9daabb8967367bd05b88c299b922b9b3fb14bb40fc508a773791b19917a/og_image-1505322f-2026-10-23T18-32-16-990Z.webp
- Full-page video: https://media.designdetails.io/library/28229faf5ec4956ce07c9bdc89dce868c612cb254355e48f8d8bdf6cca87560b/motion-1792783920097.mp4
- Video poster: https://media.designdetails.io/library/b241a6194b1c16f9996f73e282ba786104766827c02932e3d937cf0c69fb9680/motion-poster-1792783920097.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
- Feature Collection
- Primary Button
- Footer
- Network Diagram
- Marquee Ticker
- Bento Grid

## Quality rubric

Overall: 61.56/100 (Good)
Evidence coverage: 80%
Judge tier: Competent
Verdict: A well-executed, disciplined dark-theme landing page whose strongest asset is a content-accurate network diagram and comparison chart that genuinely visualize the product's thesis; typography and layout are consistently applied across sections. But the surrounding visual vocabulary largely follows a now-familiar AI-infrastructure template, the color system leans on one accent to do all its work, and motion quality cannot be substantiated from the evidence provided—keeping this at a competent, professionally assembled but not distinctive level.

- Typography (15%): 65 — A deliberate three-tier type system is used consistently: PP Eiko Light serif for display headlines (72-80px, tight negative tracking down to -3.2px), Switzer sans for body/UI text at multiple weights and sizes, and Geist Mono for technical diagram labels (agents/models/tools). The hierarchy is legible and repeated across sections (hero, feature cards, diagram, footer), giving the system real consistency rather than a one-off hero treatment.
- Color (10%): 60 — A tight, restrained dark palette (charcoal canvas/surface, off-white and muted-gray text, single teal accent, beige CTA) is applied with discipline across sections. It supports legibility and a technical mood, but the palette itself—dark base plus one desaturated accent plus a beige button—is a very common convention in current AI/B2B landing pages rather than a distinguishing choice.
- Layout (20%): 63 — The page uses a coherent structural rhythm—full-bleed hero, dotted-marquee dividers, a centered network-diagram module, a two-column bento grid for feature cards, and a bar-chart comparison block—all held to a consistent content column with generous margins. The variety of section types is handled with the same spacing/border language, giving real systemic consistency, though the overall shape (bento cards + marquee ticker + closing CTA/footer) matches a widely used contemporary SaaS template structure.
- Motion (20%): Inconclusive — The provided recording shows essentially continuous vertical scrolling with no confirmed scroll-linked choreography, hover states, or transition timing. The observer explicitly notes uncertainty about whether diagram/chart elements use true scroll-triggered builds or are simply static during the fast pass, and video compression further obscures fine detail. There isn't enough evidence to credit or penalize specific motion craftsmanship (easing, sequencing, interaction feedback).
- Originality (25%): 58 — The strongest original gesture is the network diagram literalizing the product's own conceptual model (agents/models/tools/workflows/jobs/tasks/pipelines orbiting a central 'aethr' node), and the paired 'with aethr vs without aethr' bar chart that visualizes the value proposition directly. These are genuine content-driven ideas. However, the surrounding vocabulary—dark charcoal canvas, single teal accent, serif-display-over-dark-network-lines hero, bento cards, dotted-texture dividers, pill CTA—closely matches a now-recognizable convention among contemporary AI-infrastructure marketing sites, limiting how distinctive the overall system feels.
- Content (10%): 64 — Visual elements are meaningfully tied to the copy: the node diagram's labels (agents, models, tools, workflows, jobs, tasks, pipelines) correspond to the actual categories the product claims to unify, and the bar chart directly dramatizes the stated growth thesis. Section headers (Exposing the Map, One Approved Hop at a Time, Structural Neutrality) are paired with matching iconography, showing intentional content-to-visual mapping rather than decorative stock imagery.

Coverage: 80% 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
- [x] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

Large serif headlines float on a near-black field with faint constellation lines, giving an abstract network a sense of scale and calm. Thin diagrams with labelled nodes like agents, models and tools turn an intangible system into something scannable, while repeated dotted-texture bands pace the long page into clear chapters.

## 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.