How to Sample Logo Colors in Procreate

The short answer

Procreate's color picker is the round color swatch in the top-right corner of the interface. Tap it to open the Colors panel, where you can choose, inspect and save colors. To sample a color from existing logo artwork, use the eyedropper. By default you activate it by touching and holding a finger on the canvas. You can also tap the square button in the left sidebar between the brush size and opacity sliders. Drag to the area you want and lift your finger. That color becomes your active color. Open the Colors panel's Value tab to read its numeric values, including the hexadecimal (hex) code.

A hex code is a six-character code, such as #1A2B3C, that records a color's red, green and blue values. It is the most portable way to carry a sampled color into a vector program, where you apply it as a fill (the color inside a closed path) or a stroke (the color along a path's outline). Procreate is a raster painting app. Sampling there gives you color values, not vector geometry. Rebuilding the logo's paths is a separate job done in a vector editor.

Before you start

• Import the cleanest logo source available. A flat, uncompressed image such as a PNG gives more reliable samples than a screenshot or a heavily compressed JPEG.
• Note the canvas color profile. Procreate assigns a color profile when you create a canvas, and the same pixels can return different numbers under different profiles. For screen-oriented logo work, sRGB is the common reference.
• If you have official brand guidelines, keep them nearby. Specified values in a style guide take precedence over anything you sample.
• Having a logo file does not give you permission to reuse the mark. Sampling its colors does not change that.

Step-by-step: sampling a logo color

• 1. Place the logo on the canvas. Use Actions > Add > Insert a photo (or Insert a file), then position it on its own layer.
• 2. Zoom in on a solid, flat area of the color you want. Stay well away from edges, gradients and lettering outlines.
• 3. Activate the eyedropper by touching and holding the canvas, or by tapping the square button in the sidebar.
• 4. Watch the sampling ring that appears. It previews the color under your finger against your previous color. Drag until the preview shows the flat interior color.
• 5. Lift your finger to set the sampled color as the active color. The color swatch in the top-right corner updates to match.
• 6. Tap the color swatch, open the Value tab, and record the hex code. The same tab also shows HSB and RGB values.
• 7. Repeat for each distinct color in the logo.

Saving the colors as a palette

In the Colors panel, open the Palettes tab and create a new palette for the logo. With a sampled color active, tap an empty square in the palette to save it there. Repeat this for each color so the full logo set stays together. Procreate can also generate a palette from a photo or file, which works as a quick overview. However, automatic extraction can pick up edge blends or compression artifacts. For logo work, deliberate manual samples are more trustworthy. Keep a separate written list of the hex codes as well, because that list moves into other software more easily than a Procreate palette file.

Adjusting how the eyedropper is triggered

If touch-and-hold opens the eyedropper too easily or too slowly, open Actions > Prefs > Gesture controls and select Eyedropper. There you can change the gesture used to activate it and adjust the hold delay. Menu names and layouts can shift between Procreate releases, so check these paths against the version installed on your device.

Checking that the sample is accurate

• Sample the same color region at several points. Consistent hex codes suggest a flat fill. Varying codes suggest compression noise, texture or a gradient.
• Compare the hex code with any official brand value. If they differ, use the official value and treat the sample as approximate.
• Paint a block of the sampled color on a new layer next to the original and compare them at high zoom. A visible seam means the sample is off.
• Check what the eyedropper is reading. It samples the colors you see on the canvas, so semi-transparent layers, blend modes or a colored background behind the logo can change the result. Hide unrelated layers before sampling.

Common sources of wrong colors

Anti-aliasing is the softening of edges with blended in-between pixels so curves look smooth. It is the most frequent cause of off colors. A sample taken at a letter's edge returns a mix of the logo color and the background. JPEG compression adds blocky color variations, especially around sharp contrast. Screenshots may be color-managed by the device that captured them. Any of these can produce a hex code that is close to the true color but not exact.

Using sampled colors in print and vector delivery

Values sampled in Procreate are screen (RGB) values. They are not CMYK separations or spot-color matches such as Pantone references. Converting a sampled RGB color to CMYK or a spot color estimates the original; it does not recover it. For print delivery, confirm final ink values with the brand owner or printer. When you rebuild the logo in a vector editor, enter the recorded hex codes as fill and stroke colors. Then compare the vector version against the source image to confirm the colors still read correctly.

Gaps to be aware of

This guide describes Procreate's general color-sampling workflow without reference to a specific release. Button placement, menu labels and palette-import options should be checked against your installed version. No measured color data or official brand values were supplied for any particular logo. Any hex code you sample is a reading of that image file, not a confirmed brand specification.