Templates

Pre-built chart templates for common use cases. Render with query parameter overrides. Use GET /api/v1/templates to list all templates including your custom ones.

Built-in Templates

16 production-ready templates. All support brand kit overrides via brandKitId and data overrides via labels / data query parameters.

Template ID	Description
mrr-trend	MRR line chart with target line and launch window annotations
signups-bar	Signups bar chart with on-bar data labels
weekly-volume-rate	Mixed bar (volume) + line (conversion %) with dual Y axes
plan-distribution	Plan distribution pie chart
funnel-conversion	Funnel stages bar chart showing drop-off at each step
nps-trend	NPS score trend line with reference zones
churn-rate	Monthly churn rate line chart with target annotation
mrr-growth	MRR growth bar chart with month-over-month delta
email-performance	Email open/click rates bar chart
ad-spend-roi	Ad spend vs. return bar chart with ROI line overlay
csat-breakdown	CSAT score distribution doughnut chart
support-volume	Support ticket volume bar chart by category
pipeline-stages	Sales pipeline stages bar chart
win-rate-trend	Win rate trend line with rolling average
quota-attainment	Quota attainment bar chart with target line
ltv-cac	LTV vs. CAC comparison bar chart

Rendering a Template

Use the GET endpoint with optional data and style overrides:

text

GET /api/v1/templates/mrr-trend/render?labels=Jan,Feb,Mar,Apr,May&data=12000,15000,18000,22000,25000&format=png&brandKitId=obsidian

Omitting scale defaults to 2× output (retina). Pass scale=1 for 1×.

Query Parameters

Parameter	Description
`labels`	Comma-separated x-axis labels
`data`	Comma-separated numeric values
`title`	Override chart title
`width`, `height`	Dimensions in pixels (100–4000)
`format`	png, jpeg, svg, webp
`brandKitId`	Saved kit UUID or preset: `obsidian`, `linen`, `polar`, `studio`, `ember`, `harbor`
`scale` / `devicePixelRatio`	1–4; defaults to 2 on this route when omitted
`palette`	Comma-separated hex colors (URL-encode `#` as `%23`) — overrides series colors

Card Template Example

Templates that include card composition (header, kpiStrip, footer) render the full card. You can also supply a full card spec to POST /api/v1/render directly:

json

{
  "type": "line",
  "brandKitId": "obsidian",
  "header": {
    "eyebrow": "Metrics · Jan–May 2024",
    "title": "MRR Trend",
    "badge": { "text": "+14%", "backgroundColor": "#166534", "color": "#dcfce7" }
  },
  "kpiStrip": [
    { "label": "MRR",    "value": "$25,000", "color": "#22c55e" },
    { "label": "ARR",    "value": "$300k",   "color": "#22c55e" },
    { "label": "Growth", "value": "+14%",    "color": "#22c55e" }
  ],
  "footer": { "left": "chart-output.com", "right": "Updated daily" },
  "data": {
    "labels": ["Jan", "Feb", "Mar", "Apr", "May"],
    "datasets": [{ "label": "MRR", "data": [12000, 15000, 18000, 22000, 25000] }]
  }
}

Custom Templates

Save any chart spec as a reusable template via the dashboard or API:

json

POST /api/v1/templates
{
  "name": "Monthly MRR",
  "description": "Standard MRR line chart with card",
  "chartType": "line",
  "spec": { ... }  // Any valid chart spec including card composition
}

Once saved, render it the same way as built-in templates using the returned UUID as the templateId.