Home/Guide
User guide

Make your first color rule in a few minutes.

Pick a difficult color, choose a clearer replacement, and save it for the site you are using.

01

Create your first rule

  1. Open the extension on the website you want to adjust.
  2. Select Pick color from page, then click an element.
  3. If the element has several colors, choose text, background, border, fill, or stroke.
  4. Choose a Target color and adjust Similarity. A value of 0 changes only an exact match; 15 includes nearby shades.
  5. Check the Preview, then select Add rule & save.

You can also type Source and Target colors directly in the Popup. Unsaved previews are restored when the Popup closes.

02

Choose a likely red and green mix-up

The picker checks CSS and SVG colors used on the current page. It highlights pairs that may look more alike under protan and deutan simulations and shows how often each color appears.

Select a suggestion to use it as the Source. The color after “may resemble” is another color from the same page that could be confused with it.

03

Try an automatic replacement

Auto target · same brightness & saturation looks for a clearer blue, cyan, or purple while keeping the original color's perceived lightness and saturation as close as possible.

Use Preview to check the result against the page around it. You can always adjust the suggested color yourself.

04

Name your rules

New rules start with a name such as rule_1_github.com.

  • Rename gives the rule a name you will recognize later.
  • Default restores the generated name.
  • Generated rule numbers update when you reorder or delete rules.
05

Use a palette on every website

  1. Open Advanced settings and choose the Global profile.
  2. Turn on Profile enabled and save your rules.
  3. Select Allow all websites… and approve site access.

A site's own rules take priority over Global rules. Turning off a site profile also blocks Global rules on that site.

06

Back up and manage palettes

Advanced Settings lets you duplicate and delete site profiles. Export downloads all settings as JSON. Import validates a JSON file before replacing your current settings.

07

Supported content

  • Supported: text, backgrounds, borders, outlines, text decoration, SVG fill, and SVG stroke.
  • Not supported: images, video, Canvas, WebGL, gradients, shadow DOM, and iframe contents.
  • Chrome settings and the Chrome Web Store are protected pages, so extensions cannot change them.
  • If too many colors change, lower Similarity and check the rule order. The first matching rule wins.