{"uid":"cap_Z76xDK9925i-uyUmImFiz","slug":"color-gradient-steps-generator-1bb3ff8c","name":"Color Gradient Steps Generator","description":"Evenly spaced color steps between two hex colors, in sRGB or linear light, for charts, heatmaps and gradients.","url":"https://color-design.x402tookit.com/gradient-steps?utm_source=zero.xyz","method":"GET","headers":{},"bodySchema":{"type":"object","$schema":"https://json-schema.org/draft/2020-12/schema","required":["input"],"properties":{"input":{"type":"object","required":["type","method"],"properties":{"type":{"type":"string","const":"http"},"method":{"enum":["GET"],"type":"string"},"queryParams":{"type":"object","required":["from","to"],"properties":{"to":{"type":"string","description":"End hex color"},"from":{"type":"string","description":"Start hex color"},"space":{"type":"string","description":"srgb (default) or linear"},"steps":{"type":"integer","description":"Number of colors, 2 to 32, default 7"}}}},"additionalProperties":false},"output":{"type":"object","required":["type"],"properties":{"type":{"type":"string"},"example":{"type":"object","properties":{"to":{"type":["null","string"]},"css":{"type":["null","string"]},"asOf":{"type":["null","string"]},"from":{"type":["null","string"]},"space":{"type":["null","string"]},"colors":{"type":["array","null"],"items":{"type":"string"}},"source":{"type":["null","string"]},"reasons":{"type":["array","null"],"items":{"type":"string"}},"summary":{"type":["null","string"]},"verdict":{"type":["null","string"]},"degraded":{"type":["boolean","null"]},"disclaimer":{"type":["null","string"]},"notChecked":{"type":["array","null"],"items":{"type":"string"}}}}}}}},"responseSchema":null,"example":null,"exampleRequest":null,"tags":["x402"],"displayCostAmount":"0.02","displayCostAsset":"USDC","priceDynamic":false,"priceHint":null,"priceStatus":"priced","priceSource":"probe","requiresHandshake":false,"reviewCount":0,"rating":{"score":"0.00","successRate":"0.00","reviews":0,"stars":null,"state":"unrated"},"availabilityStatus":"unknown","priceObserved":null,"sessionDeposit":null,"pricing":{"kind":"static","summary":"$0.02/call","primary":{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.02","per":"call","confidence":"exact"},"accepted":[{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.02","per":"call","confidence":"exact"}]},"paymentMethods":[{"uid":"pm_NfbdQ8ORW3HsCg1y-eZLA","protocol":"x402","methodType":"crypto","chain":"base","mode":"charge","costAmount":"0.02","costPer":"request","priority":0,"asset":"0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913","unit":"request","depositMicros":null,"planRef":null}],"brandName":null,"brandSlug":null,"brandBaseUrl":null,"brandDocsUrl":null,"whatItDoes":"Returns evenly spaced hex color steps between two hex colors in sRGB or linear light color space, for use in charts, heatmaps, and gradients.","exampleAgentPrompt":"Give me 9 evenly spaced hex color steps from #1a237e to #e53935 in linear light — I want to use them as a heatmap color scale.","exampleUseCases":[{"title":"Heatmap color scale for data viz","prompt":"I need 12 evenly spaced colors going from #00897b to #e53935 in linear light so I can use them as a heatmap scale in my chart."},{"title":"CSS gradient stops for a banner","prompt":"Generate 7 color steps between #6a1b9a and #f9a825 in sRGB so I can build a smooth CSS gradient for my website banner."},{"title":"Chart axis color ramp","prompt":"Can you get me 5 hex color stops from #ffffff to #1565c0 in sRGB for the color axis of my bar chart?"}],"resultDescription":"Returns an array of hex color strings evenly interpolated between the start and end colors, plus the CSS gradient string, the input from/to colors, the color space used, and optional metadata fields like source and summary.","failureModes":["Missing required 'from' or 'to' query parameters returns an error","Invalid hex color format causes a 400-level error","Steps value outside 2–32 range may be rejected or clamped","Unsupported color space value causes an error","Payment not included or insufficient USDC results in a 402 Payment Required response"],"whenToPreferThis":"Use this endpoint when you need a precise, mathematically evenly spaced sequence of hex colors between two endpoints, especially for data visualization artifacts like heatmaps, chart gradients, or color scales. It supports both perceptual sRGB interpolation and physically correct linear light interpolation, making it better than naive CSS gradient approximations when color accuracy matters.","instructions":null,"reviewSummary":null,"reviewSummaryHighlights":null,"reviewSummaryConcerns":null,"reviewSummaryGeneratedAt":null,"activationCount":0,"lastUsedAt":null,"lastSuccessfullyRanAt":null,"lastHealthCheckAt":"2026-10-30T00:31:11.215Z","isFirstParty":false,"canonicalSlug":"color-gradient-steps-generator-1bb3ff8c"}