Swatches lie. A color that looks perfect in a grid of 10 rectangles might look completely wrong when applied to a real webpage with text, images, shadows, and spacing. That is why PaletteRx includes a Live Preview that shows your colors in context.
How It Works
After importing a website in Step 1, PaletteRx maps the original site's core colors to your palette colors. It then applies those substitutions to the actual HTML, replacing CSS values, inline styles, and SVG fills. The result is the original site, re-rendered with your new color palette.
The Color Mapping
PaletteRx uses perceptual similarity to determine which original color maps to which palette color. The lightest original colors map to your lightest colors, the darkest to your darkest, and chromatic colors are matched by hue proximity. You can see and adjust the mapping in the Preview panel.
When to Use It
Live Preview is most valuable for redesigns. If you are refreshing a client's site colors, you can show them "here is your current site with the new palette." That is far more convincing than a swatch grid. It is also useful for catching issues you would never spot in swatches: text becoming unreadable on a tinted background, borders disappearing, or hover states blending into their containers.