Design
Image Palette to Design Tokens
Extract a dominant color palette from an image (k-means clustering), then export it as CSS variables, SCSS variables, a Tailwind config, or JSON design tokens — with named colors and an auto-generated shade scale for each
html· HTML resultOpen tool
Quick start
Call this tool from your code in three languages.
cURL
# 1) Request a presigned URL → returns { uploadUrl, storageKey }
curl -X POST 'https://api.elysiatools.com/api/upload/presign/image-to-design-tokens' \
-H 'Content-Type: application/json' \
-d '{"filename":"image.ext","contentType":"application/octet-stream","size":12345}'
# 2) PUT the file bytes directly to the presigned uploadUrl
curl -X PUT '<presigned uploadUrl>' \
--data-binary @/path/to/file.ext
# 3) Call the tool, passing the returned storageKey for each file field
curl -X POST 'https://api.elysiatools.com/en/api/tools/image-to-design-tokens' \
-F 'image=uploads/2026/01/01/your-tool-1700000000000-abc123.ext' \
-F 'paletteSize=5' \
-F 'scale=tailwind' \
-F 'format=css' \
-F 'prefix=brand' \
-F 'naming=semantic'