How to Extract Colors from an Image
GradLab can pull a color palette directly from any photo, illustration, or screenshot. The extracted colors feed straight into the gradient engine, so you can create a gradient that matches your brand, artwork, or reference image.
Step 1: Upload your image
In the panel, find the Upload Image / Param Code area. Either:
- Click it to open a file picker
- Drag and drop an image file onto the upload zone
Supported formats: JPEG, PNG, WebP, GIF, and most other common image formats.
Step 2: Sample colors
After uploading, the Extract Colors modal opens. It shows your image with colored markers placed automatically at diverse color points.
- Drag a marker to any point in the image to sample that color
- Add markers with the + Color button to extract more colors
- Remove markers with the − Color button
The markers show a live preview of the sampled color. Move them around to find the exact tones you want.
Step 3: Apply to the gradient
Click Done. The sampled colors replace the current palette in the gradient. The canvas updates immediately.
Tips for great results
Match a brand identity Upload a brand photo, campaign image, or screenshot of a product. Sample the dominant colors to create a gradient that's on-brand without manual color matching.
Use complementary colors For the most visually pleasing gradients, place markers on areas with distinct hues rather than similar tones. A highlight, a midtone, and a shadow from the same image often produce natural-looking gradients.
Reduce color count for cleaner gradients 3–4 well-chosen colors usually produce cleaner results than 6–8 similar ones. Remove markers for any colors that feel redundant.
Adjust after extraction The extracted colors are a starting point. After applying, you can click any swatch in the color list to fine-tune individual colors using the color editor.
Uploading a background image
There is also a separate Upload Background option under Shape & Flow. This diffuses an image directly into the gradient rather than extracting discrete color stops — useful for blending photographic texture into the animation.