Not every project uses a standard page builder or framework. Custom applications, CMS integrations, internal tools, and API-driven systems need palette data in a structured format they can parse programmatically. PaletteRx's JSON export provides exactly this.
The JSON Structure
The export produces a JSON array where each color object includes: hex (the color value), role (Primary, Secondary, Light Base, Dark Base), hsl (an object with h, s, l values), rgb (an object with r, g, b values), and slug (a CSS-safe name like "primary", "secondary-2", "light-base").
This structure gives you every representation of each color in a single payload. Parse the hex for direct display, use HSL for shade generation, use RGB for canvas operations, and use the slug for variable naming.
Integration Patterns
For CMS integration, store the JSON in a custom field and parse it in your theme templates to generate CSS variables dynamically. For API-driven apps, serve the JSON from an endpoint and consume it on the client to theme the interface. For design tools, import the JSON and map each color to your tool's token format.
W3C Design Tokens Alternative
If your toolchain supports the W3C Design Token specification, PaletteRx also exports in that format. The W3C format uses a standardized structure with $type, $value, and $description fields that tools like Style Dictionary, Figma Tokens, and Specify can consume directly.
Workflow Automation
Download the JSON file and include it in your build pipeline. A simple script can read the JSON and generate CSS variables, SCSS maps, Swift constants, or any other format your project needs. PaletteRx's JSON export becomes the single source of truth that feeds every downstream format.