Post-Processing

Palette

Palette maps the image colors to a custom gradient or limited color palette. This creates posterization effects, duotones, or retro gaming color schemes.

Example Configuration

palette.json

{
  "effect": {
    "postProcesses": [
      {
        "id": "pp_palette",
        "type": "palette",
        "enabled": true,
        "settings": {
          "paletteId": null,
          "colors": ["#000000", "#ff0000", "#ffff00", "#ffffff"],
          "intensity": 1
        }
      }
    ]
  }
}

Settings

Property	Type	Default	Description
`paletteId`	string \| null	null	Built-in palette ID (null for custom colors)
`colors`	string[]	["#000000", "#ffffff"]	Gradient colors as hex values
`intensity`	number	1	Effect strength (0-1)

Example Palettes

Style	Colors
Game Boy	["#0f380f", "#306230", "#8bac0f", "#9bbc0f"]
Duotone Blue	["#000428", "#004e92"]
Sunset	["#2c1810", "#c44536", "#f77f00", "#fcbf49"]
Cyberpunk	["#0d0221", "#541388", "#ff00ff", "#00ffff"]

API Usage

render-request.json

POST /api/v1/render
{
  "state": {
    "canvas": {
      "aspectRatio": "16:9",
      "backgroundColor": "#1a1a1a"
    },
    "layers": [...],
    "selectedLayerId": null,
    "effect": {
      "effectId": "dither-atkinson",
      "enabled": true,
      "postProcesses": [
        {
          "id": "pp_1",
          "type": "palette",
          "enabled": true,
          "settings": {
            "colors": ["#0f380f", "#306230", "#8bac0f", "#9bbc0f"],
            "intensity": 1
          }
        }
      ]
    }
  },
  "format": "png",
  "width": 1920,
  "height": 1080
}

Tips

Use 2 colors for duotone effects
4 colors works well for retro gaming palettes
Combine with dither effects for authentic 8-bit look
Order colors from dark to light for best gradient mapping
Lower intensity blends palette with original colors