---
name: Qatalog
description: "This site is a strong example of a modern, AI-driven SaaS landing page that balances professional restraint with forward-looking technology positioning."
version: alpha

colors:
  background: "#FFFFFF"
  primary: "#292D34"
  secondary: "#646464"
  tertiary: "#5D5D85"
  neutral: "#838383"
  bg-quiet: "#F0F0F0"
  line: "rgba(41, 45, 52, 0.1)"

typography:
  display:
    fontFamily: humanist-sans
    fontSize: 60px
    lineHeight: 1.1
    fontWeight: 700
    letterSpacing: "-1.6px"
  headline:
    fontFamily: humanist-sans
    fontSize: 18px
    lineHeight: 1.3
    fontWeight: 500
    letterSpacing: "-0.15px"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 1.5
    fontWeight: 400
    letterSpacing: "-0.12px"
  caption:
    fontFamily: humanist-sans
    fontSize: 14px
    lineHeight: 1.4
    fontWeight: 400
    letterSpacing: "-0.1px"

rounded:
  sm: 4px
  md: 8px
  lg: 12px
  pill: 30px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

An enterprise-grade AI workspace that eliminates work sprawl and unifies productivity.

*An AI-powered command center for modern teams, merging tools and information.*

## Colors

A clean, high-contrast white base with neutral grays and a singular purple accent for a premium, focused aesthetic.

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#292D34`)** — uses `ink` token
- **Secondary text (`#646464`)** — uses `ink-soft` token
- **Accent (`#5D5D85`)** — uses `accent` token
- **Muted (`#838383`)** — uses `muted` token
- **Borders (`rgba(41, 45, 52, 0.1)`)** — uses `line` token

## Typography

- **Display:** humanist-sans
- **Body:** humanist-sans
- **Mono:** monospace

- Display headings use tight tracking and bold weights to convey authority.
- Body text maintains a comfortable line height for readability.
- Monospace is reserved for specific technical labels or code elements.

## Layout

A responsive layout shifting from a multi-column grid on desktop to a single-column stack on mobile.

*Rhythm:* Consistent vertical and horizontal rhythm established through a multiple of 4px.

## Elevation & Depth

- 0px 4px 12px rgba(0, 0, 0, 0.08)
- Borders: Subtle 1px borders in light gray to define card edges and containers.

## Shapes

- `sm`: 4px
- `md`: 8px
- `lg`: 12px
- `pill`: 30px

## Components

- **button:** Primary buttons are high-contrast with rounded pill shapes, while secondary buttons utilize lighter backgrounds.
- **card:** Cards are defined by subtle borders and generous internal padding, occasionally featuring soft gradients or background imagery.
- **chip:** Small, rounded tags or labels used for status updates or category markers.
- **input:** Search bars feature prominent rounded corners and integrated iconography.
- **hero:** Large, text-heavy sections paired with dynamic, AI-focused illustrations or product mockups.

## Do's and Don'ts

**Don't:**
- Don't use a dark theme as the primary mode — screenshot shows a light theme with dark text.
- Don't use decorative serif fonts — screenshot shows humanist sans-serif fonts throughout.
- Don't use highly saturated or neon colors as primary accents — screenshot shows a restrained palette with purple accents.
- Don't use sharp, square corners on primary buttons — screenshot shows rounded pill shapes.
- Don't use excessive drop shadows or heavy 3D effects — screenshot shows clean, flat or subtly bordered surfaces.
- Don't use complex multi-column grids for mobile — screenshot shows a single-column stack on smaller screens.

---

## System Prompt (paste into AI agent)

```
A premium AI workspace tool designed for enterprise productivity, using a clean light theme with a white base (#FFFFFF) and neutral grays (#292D34, #646464). The typography uses humanist-sans fonts with tight tracking for display headings. A subtle purple (#5D5D85) serves as the primary accent. Layout is a responsive 12-column grid. Critical don'ts: avoid dark themes, avoid serif fonts, avoid neon colors, avoid square buttons, avoid heavy shadows, avoid complex mobile grids.
```