# Design Intelligence

> Access curated design principles and proven patterns for page composition

Canonical URL: https://fa7e86e3d553:3005/tools/design-intelligence

> **MCP v3 routing:** The operation names on this page are retained as action-contract references. Do not call them as top-level tools. Pass the former name to `lexsis_discover`, then call the returned router and action with the documented parameters inside `args`.

Access curated design principles and proven patterns. Use these tools to generate high-quality pages that follow best practices and match brand aesthetics.

---

## get_design_principles

Get composition rules, anti-patterns, and tips for a specific design context (hero, CTA, typography, etc.). **Call this BEFORE generating sections** to ensure you follow best practices.

### Parameters

| Param | Type | Required | Description |
|-------|------|----------|-------------|
| `context` | `"page_composition"` \| `"hero"` \| `"social_proof"` \| `"features"` \| `"cta"` \| `"typography"` \| `"color"` \| `"spacing"` \| `"animation"` \| `"ecommerce_cro"` | **Yes** | Design context to get principles for |
| `brand_mood` | `"luxury"` \| `"playful"` \| `"minimal"` \| `"bold"` \| `"editorial"` \| `"trust_first"` | No | Brand mood — filters tips and variant recommendations |
| `section_count` | `number` (1-20) | No | Total sections planned — adjusts composition rules |

### Returns

Design guidance object:

```json
{
  "rules": [
    "Hero should be 60-100vh tall for impact",
    "Use max 2 CTAs — primary + secondary"
  ],
  "antiPatterns": [
    "Don't stack more than 3 elements vertically in a hero",
    "Avoid centered text for long body copy (>3 lines)"
  ],
  "tips": [
    "For luxury brands: generous white space, serif headings, muted CTAs",
    "For conversion-focused: high-contrast CTAs, urgency copy, trust badges"
  ],
  "variants": [
    {
      "name": "split_image_right",
      "best_for": "Product pages, feature highlights",
      "mood_fit": ["minimal", "editorial"]
    }
  ]
}
```

### Example

**Tool call:**
```json
{
  "name": "get_design_principles",
  "arguments": {
    "context": "hero",
    "brand_mood": "editorial",
    "section_count": 8
  }
}
```

### When to Use

- **Before generating any section** — check rules/anti-patterns for that section type
- When you're unsure which variant to use — the `variants[]` array suggests best fits
- To understand brand-mood-specific guidance (e.g., luxury vs playful)

---

## get_design_patterns

Get 2-3 proven pattern snippets for a specific section type. Returns concrete `settings`, `element_styles`, and variant recommendations you can use directly.

### Parameters

| Param | Type | Required | Description |
|-------|------|----------|-------------|
| `section_type` | `string` | **Yes** | Component type, e.g. `"lx_hero"`, `"lx_value_props"`, `"lx_reviews"`, `"lx_cta"`, `"lx_stats"`, `"lx_faq"`, `"lx_footer"`, `"lx_logo_carousel"` |
| `variant` | `string` | No | Specific variant to filter patterns for |
| `style_goal` | `"premium"` \| `"conversion_focused"` \| `"editorial"` \| `"bold"` \| `"minimal"` | **Yes** | Visual/business goal for this section |

### Returns

Array of design patterns with concrete CSS and settings.

### Example

**Tool call:**
```json
{
  "name": "get_design_patterns",
  "arguments": {
    "section_type": "lx_hero",
    "style_goal": "editorial"
  }
}
```

### When to Use

- **While generating a section** — copy `settings` and `element_styles` directly into blueprint JSON
- To see proven examples for your style goal (premium, conversion, bold, etc.)
- When you're unsure what CSS values to use for a section

---

## Workflow: Design Intelligence

### 1. Get Principles Before Generating

```
1. get_design_principles({ context: "hero", brand_mood: "editorial" })
   → Read rules and anti-patterns

2. Generate hero section following those rules
```

### 2. Apply Proven Patterns

```
1. get_design_patterns({ section_type: "lx_hero", style_goal: "editorial" })
   → Get concrete settings and element_styles

2. Copy settings/styles into blueprint JSON
```

---

## Design Intelligence + Page Generation

**Best practice sequence:**

1. `get_workspace_details` → understand vertical/industry
2. `get_brand_kit` → load brand identity
3. `get_design_principles({ context: "page_composition", brand_mood, section_count })` → page-level rules
4. For each section:
   - `get_design_principles({ context: <section_context> })` → section-specific rules
   - `get_design_patterns({ section_type, style_goal })` → proven examples
   - Generate section following rules + patterns
5. Publish page

This ensures every page follows best practices and matches the brand's visual identity.