{"schemaVersion":"1.0","kind":"composio-brand-page","generatedAt":"2026-09-20T13:30:01.273Z","page":{"path":"/chart-guidelines","url":"https://brand.composio.dev/chart-guidelines","agentJsonPath":"/chart-guidelines/agent.json","agentJsonUrl":"https://brand.composio.dev/chart-guidelines/agent.json","title":"Chart Guidelines","description":"The design system behind Composio chart cards: 1200×675 dark surface, Geist Sans + JetBrains Mono type roles, the seven-hue dither palette, Bayer 4×4 engine rules, chrome/footer conventions, and per-template implementation constants.","category":"assets"},"agent":{"crawlHint":"This endpoint is intentionally machine-readable. Use data for tokens/specs and assets/endpoints for downloadable resources.","notes":["These tokens are the same system the chart API renders with — compose configs against /api/chart/instructions rather than restating rules from this page."]},"data":{"surface":{"width":1200,"height":675,"export":"2400×1350 @2x","background":"#000"},"padding":{"x":32,"top":32,"bottom":16,"chartTopGap":16,"footerY":16,"footerMinHeight":57.5,"panelGap":64},"fonts":{"sans":"Geist Sans — titles 40/500/-0.01em capitalize, panel titles 20/500, names 19/500, stat values 500/-0.02em tabular; never above weight 600","mono":"JetBrains Mono — captions 16, meta 14, badge 13/500 (all uppercase +0.05em), values 600 tabular (18/16/12), ticks 18/14/12/10, footnote is sans 12 italic"},"ditherPalette":{"green":[40,210,110],"blue":[53,143,243],"purple":[150,110,255],"pink":[240,90,190],"orange":[255,150,50],"red":[240,70,70],"grey":[92,92,100]},"engine":{"bayer":"4×4 ordered matrix, thresholds (v+0.5)/16","cellPx":2,"borderAlpha":0.72,"rule":"one fill color per series, alpha varies with density; fade runs solid-at-origin to sparse-at-value-edge"},"footer":"wordmark and badge pill hidden by default; opt-in via footer:{badge,wordmark}; emerald badge for bench, sky+icon for time/growth","sourceOfTruth":"standalone/gen.mjs generates the templates, the API's TS copies, and the example configs"},"assets":[],"endpoints":[{"method":"POST","name":"Render a chart","path":"/api/chart","description":"Config JSON in, 2400×1350 PNG out.","url":"https://brand.composio.dev/api/chart"},{"method":"GET","name":"Chart-as-URL","path":"/api/chart?c=<base64url JSON>","description":"Edge-cached immutable PNG keyed by the config in the URL.","url":"https://brand.composio.dev/api/chart?c=%3Cbase64url%20JSON%3E"},{"method":"GET","name":"Agent instructions","path":"/api/chart/instructions","description":"Living instructions: schemas, design rules, and working example configs.","url":"https://brand.composio.dev/api/chart/instructions"}],"index":{"rootAgentJsonPath":"/agent.json","rootAgentJsonUrl":"https://brand.composio.dev/agent.json","llmsTxtPath":"/llms.txt","llmsTxtUrl":"https://brand.composio.dev/llms.txt"}}