Pick Colors from Any App with the Screen Eyedropper

The color you need is almost never in IconVectors. It is in the brand page open in the browser, in the Figma frame on the other monitor, in a screenshot of the app the icon will live in. IconVectors 2.1+ puts an eyedropper in the Colors panel that samples any pixel on screen, with a magnifier so you can hit the right one, and applies it with the same left-click for Fill and right-click for Stroke rule as the rest of the panel.

This guide is for IconVectors 2.1+ on Windows. The desktop sampler is Windows-only in this release; on macOS and Linux the button explains that instead of returning a wrong color, and everything else in the Colors panel works as before. If you have not used the panel yet, Fill and Stroke Colors with the Colors Panel covers the basics.

1. Put the source color on screen

Arrange the windows so the color you want is visible next to IconVectors: the brand site at 100% zoom, a design tool, an image viewer with a screenshot. Zoom in on the source if the area is small, because the sampler reads what is painted on screen, not the original asset. A 1 pixel border is hard to hit at 1x and easy at 400%.

2. Select the elements to color

In the Editor, select the paths or groups that should receive the color. The sampled color is applied to the current selection, so select first; with nothing selected the color only becomes the panel's defined color and the drawing defaults, which is sometimes exactly what you want before drawing a new shape.

3. Click the eyedropper and find the pixel

In the COLORS page, click the eyedropper button to the right of the HEX, RGB or HSL editors. The screen is captured at that instant, then a magnified preview follows the pointer. Move over the source. The preview shows the pixels around the pointer with the sampled one outlined, and the hex value underneath, and it keeps itself inside the current monitor when you approach an edge. Watch the hex as you move: on an anti-aliased edge it changes every pixel, so slide toward the middle of the colored area until it stops changing.

4. Left-click for Fill, right-click for Stroke

Left-click to apply the color to the selection's Fill. Right-click to apply it to the Stroke. The click is consumed by the sampler, so nothing underneath receives it: sampling a button in a browser does not press the button. The accepted color also becomes the panel's defined color and shows in Select:; it does not reorder the Recent: list.

Esc cancels without changing the color, the artwork or the drawing defaults.

5. Check the value and reuse it

The HEX editor now holds the sampled value. If the brand guide says #E0452B and you read #E1452C, you sampled a slightly different pixel, or the source is color-managed or HDR, where on-screen values are not guaranteed to match the file. Type the exact value in that case; the sampler got you within one step. For the second element that needs the same color, select it and left-click the large swatch on the Select row; there is no need to sample again.

What the sampler does and does not do

• It reads the displayed, composited RGB value, which is what a user sees. A semi-transparent overlay on top of the source changes the result, as it would for anyone looking at the screen.
• It uses temporary local memory for the capture. Nothing is saved to disk, nothing goes to the clipboard, nothing leaves the machine.
• It respects capture restrictions. Protected content shows up as the system shows it, which may be black.
• If the selection or document changes while you are sampling, the color is not applied to something else; the session ends instead.

The same left and right click rule applies everywhere in the Colors panel in 2.1+: the saturation field, the hue strip and the swatches apply Fill or Stroke directly, with a drag previewing and the release committing. The eyedropper simply extends that to the rest of the screen. Download the IconVectors 2.10 trial for Windows and try it on a color from a page in your browser.