Ensemble API

11 interconnected design tools as a unified API. Generate complete, production-ready design systems from a single hex color. Pure computation - no AI, no external dependencies, deterministic output.

harmony → duet →
tempo chord cadence riff
→ pitch → →
→ compose

Every tool's output feeds the next. Colors inform shadows. Typography informs spacing. Spacing informs grids. All of it flows into component patterns and exports.

⬇ Download OpenAPI Spec

Quickstart

Generate a full design system with one request:

curl -X POST https://api.ensemble.hearthbyte.dev/v2/design-system \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "seed": {
      "colors": ["#3B82F6"],
      "mood": "professional",
      "preferences": {
        "color_scheme": "analogous",
        "dark_mode": true
      }
    },
    "formats": ["css", "json"]
  }'

Response includes 15 top-level keys with everything you need:

colors typography spacing shadows grid animations accessibility dark_mode components icons exports

Authentication

All requests require a Bearer token in the Authorization header:

Authorization: Bearer ens_live_xxxxxxxxxxxxxxxxxxxx

Key Types

TypePrefixUse CaseRestrictions
Server ens_live_ Backend, CI/CD, server-to-server None (full tier access)
Client ens_pub_ Frontend, browser-side Origin-locked, 50% rate limits
Test ens_test_ Development, staging Demo endpoint only
⚠ Server keys are secret Never expose ens_live_ keys in client-side code, public repos, or frontend bundles. Use ens_pub_ for browser requests.

Rate Limits

TierMonthlyHourlyBurst (10s)
Pro1,0006015
Overage$1 per 100 additional calls

Rate limit headers are included in every response:

X-RateLimit-Limit: 60
X-RateLimit-Remaining: 42
X-RateLimit-Reset: 1771034953

Client keys (ens_pub_) receive 50% of the tier's server key limits.

WebMCP

Ensemble exposes all 9 tools via WebMCP — a browser-native protocol that lets AI agents discover and invoke tools directly on the page. No API key needed for client-side use.

Discovery

Agents discover available tools from the manifest:

GET /.well-known/webmcp.json

Returns the full schema for all 9 tools — names, descriptions, and input schemas.

Runtime API

On any Ensemble tool page, the runtime is available at window.ensembleTools:

// List all registered tools
const tools = window.ensembleTools.list();

// Invoke a tool by name
const result = await window.ensembleTools.invoke('harmony', {
  hex: '#3B82F6'
});

// Get full schema (all tools + metadata)
const schema = window.ensembleTools.schema();

Each invoke() returns a result object:

{
  "content": [
    { "type": "text", "text": "{ ... JSON result ... }" }
  ]
}

Available Tools

ToolDescription
harmonyColor palette generator from a single hex code
duetFont pairing — heading + body combinations
chordShadow & elevation system (5 levels)
tempoTypographic scale from a modular ratio
riffEasing curves — cubic-bezier & spring values
cadenceGrid layout — columns, tracks, gaps
bridgeLight/dark theme builder from base tokens
composeExport design system (CSS, Tailwind, JSON, etc.)
overtureGuided brand builder — full 5-step pipeline

Example

// Generate a palette and use it
const result = await window.ensembleTools.invoke('harmony', {
  hex: '#3B82F6'
});

const palette = JSON.parse(result.content[0].text);
console.log(palette.swatches); // Array of generated colors
⚙ Page scope Tools are registered per page. Visit a tool's page (e.g. /ensemble/harmony/) to use its WebMCP tool, or visit /ensemble/build/ for the full Overture pipeline.

Unified Design System

POST /v2/design-system PAID
Run the full tool chain. One hex color in, complete design system out.

Request Body

{
  "seed": {
    "colors": ["#3B82F6"],        // 1-5 hex colors (required)
    "mood": "professional",       // optional: professional|playful|bold|calm|warm|cool
    "industry": "saas",           // optional: healthcare|fintech|saas|ecommerce|creative|...
    "preferences": {
      "color_scheme": "analogous",  // monochromatic|analogous|complementary|triadic|split-complementary
      "type_style": "modern",      // modern|classical|minimalist|expressive
      "density": "balanced",        // compact|balanced|airy
      "corners": "rounded",         // sharp|rounded|pill
      "shadow_intensity": "subtle", // flat|subtle|pronounced|dramatic
      "animation_style": "minimal", // none|minimal|fluid|energetic
      "dark_mode": true             // include dark mode variant
    },
    "accessibility": {
      "wcag_level": "AA",          // AA or AAA
      "min_contrast": 4.5           // 1-21
    }
  },
  "formats": ["css", "json"]     // All 4 formats available with Pro
}

Only seed.colors is required. Everything else has sensible defaults.

Individual Tools

Call any tool independently. Tools that depend on upstream data will auto-generate it from the seed.

Harmony - Color Palette

POST /v2/tools/harmony DEMO
Generate an 11-stop shade scale palette in OKLCH perceptual color space. Primary, secondary, accent, neutral, and semantic colors.
{
  "seed": {
    "colors": ["#E74C3C"],
    "preferences": { "color_scheme": "triadic" }
  }
}

Writes: colors - primary, secondary, accent (if triadic+), neutral, semantic (success/warning/error/info). Each with 50-950 shade scale.

Duet - Font Pairing

POST /v2/tools/duet DEMO
Curated font pairing selection with type scale generation. 15+ pairings, database-driven.

Writes: typography - heading, body, mono font families. Type scale with sizes from xs to 5xl, line heights, and letter spacing.

Pitch - Contrast Validation

POST /v2/tools/pitch DEMO
WCAG 2.1 contrast validation. Single pair mode or full palette audit.

Single pair mode:

{
  "foreground": "#3B82F6",
  "background": "#FFFFFF"
}

Full audit: Pass a seed with colors. Returns contrast matrix for 60+ meaningful combinations with fix suggestions for failures.

Writes: accessibility - audit stats, contrast matrix, failures with OKLCH fix suggestions, text color recommendations.

Tempo - Spacing

POST /v2/tools/tempo DEMO
Spacing system based on density preference. Generates a scale from 0 to 16.

Writes: spacing - base unit, scale values, density-aware adjustments.

Chord - Shadows

POST /v2/tools/chord DEMO
Shadow and elevation system. Flat to dramatic, tinted by palette.

Writes: shadows - elevation levels (xs through 2xl), focus ring, glow effect.

Cadence - Grids

POST /v2/tools/cadence DEMO
Grid, breakpoint, and column system. Responsive-ready.

Writes: grid - breakpoints, columns, container widths, gutter sizes.

Riff - Animation

POST /v2/tools/riff DEMO
Animation timing, easing curves, and motion presets. CSS-native cubic-bezier.

Writes: animations - duration scale, easing functions, named presets (fade, slide, scale, bounce).

Bridge - Dark Mode

POST /v2/tools/bridge PAID
Complete dark mode transformation. Inverts palette, adjusts shadows, recalculates contrast.

Writes: dark_mode - transformed colors, shadows, spacing adjustments, re-validated accessibility.

Motif - Components

POST /v2/tools/motif PAID
Component patterns generated from your tokens. Buttons, cards, inputs, badges, alerts, modals, navigation.

Writes: components - 7 component types with variants (primary, secondary, ghost, danger buttons; default, elevated, interactive cards; etc.).

💡 The differentiator Motif bridges the gap between "design tokens" and "usable UI." No other API generates component-level patterns from design tokens.

Score - Icons

POST /v2/tools/score PAID
Icon library recommendations based on your design style.

Writes: icons - recommended library, install instructions, size guidelines, color integration config.

Compose - Export

POST /v2/tools/compose DEMO
Export design system as CSS custom properties, JSON tokens, Tailwind config, or SCSS variables.
{
  "seed": { "colors": ["#3B82F6"] },
  "formats": ["css", "json", "tailwind", "scss"]
}

All four formats included with Pro: CSS, JSON, Tailwind, SCSS.

Utility Endpoints

GET /v2/health
Service status. No auth required.
GET /v2/usage
Current usage stats for your API key.

Error Handling

All errors return a consistent JSON envelope:

{
  "error": {
    "code": "invalid_input",
    "message": "seed.colors must have at least one color",
    "status": 400
  }
}
StatusCodeMeaning
400invalid_inputBad request body or parameters
400missing_dependencyRequired upstream data not available
401unauthorizedMissing or invalid API key
401key_expiredAPI key has expired
403tier_requiredFeature requires a higher tier
403origin_deniedClient key used from unauthorized origin
404not_foundUnknown endpoint or tool
429rate_limit_exceededToo many requests
500internal_errorSomething went wrong on our end

Pricing

TierPriceIncluded CallsToolsFormats
Pro$4.99/moComing soonAll 11All 4
Overage$1 per 100 additional API calls

API access requires a Pro subscription. All 11 tools, all export formats, full /design-system pipeline.

The browser-based tools at hearthbyte.dev/ensemble are free to use without an account.

Try It

Test the API right here. Uses the public demo endpoint - no key required. 5 requests per minute.

▶ Live API Request