CS.MONEY Color Extractor
CS.MONEY's marketplace runs hundreds of thousands of CS2 skins. After every Valve patch, dozens of new items enter the catalog — each one needing a palette tag before it shows up in filter results.
Impact: skin color tagging after a Valve patch drop — from several analyst-hours down to minutes
Design and code by Rinat Abdurakhmanov
Every skin appearing in those results carries a palette tag — assigned before the skin goes live.
Before this tool, tagging a patch drop took several analyst-hours — a direct hit to color filter TTM at peak post-release demand.
Single mode fetches a skin screenshot through a CORS proxy, samples the pixels, and runs K-means clustering in perceptual Lab* color space. Up to 3 dominant colors come back — each with hex, area share, and a mapped palette tag. Wrong auto-tag? Fix it in-place and the correction gets remembered.
Raw pixels are sampled at step intervals for speed. Near-black, near-white, and achromatic pixels are stripped before clustering — so results reflect the skin's actual color, not glare or background chrome. Cluster medoids (real pixels, not centroids) keep HEX values true to life.
When a skin is opened from the list, the two adjacent entries preload silently in the background — navigation through results is instant, no loading pauses between skins.
A patch drops, dozens of new skins hit the market. Mass mode accepts a CSV of screenshot URLs and processes the full batch sequentially in the browser — no backend, no queue. Output exports as structured CSV ready for import: name, URL, up to 3 color columns. Hours of analyst work, compressed to minutes.
Color matching has edge cases. The corrections DB lets analysts remap any specific hex to the right tag. Each fix syncs to a shared Cloudflare Worker KV store and becomes a new Lab* anchor point — future batch runs apply accumulated corrections automatically, getting sharper with every patch cycle.
Single-file web app: all UI, K-means, Lab* math, and palette logic in one index.html — no build step, no framework. Node.js CORS proxy for local dev; Cloudflare Worker for production image proxying and corrections API. Color filter TTM for new skin releases: from several analyst-hours down to minutes.
