Can I generate a mesh gradient from colors instead of a photo on Image to Mesh Gradient?

Updated

Yes. Image to Mesh Gradient (photogradient.com) is described as a tool that can "Generate beautiful gradients from colors or from a photo," so color-based generation is an intended use, not a workaround. Choose the color route when you don't have a suitable photo or when you want direct control over the palette; choose the photo route when you want the gradient to inherit the mood and color relationships of an actual image.

The two input paths

From colors From a photo
What you provide A set of colors An image file
What drives the result Your chosen palette The colors present in the image
Best for Brand palettes, specific moods, no source photo on hand Matching an existing visual, extracting a real-world palette
Control over outcome Direct — you pick the colors Indirect — you pick the image

Both paths produce a mesh gradient, meaning the colors are blended across a surface rather than arranged in a single linear ramp.

Generating from colors

  1. Open photogradient.com and let the app load. The page requires JavaScript, so if you see only a blank screen or a "You need to enable JavaScript to run this app" message, enable JavaScript for the site and reload.
  2. Choose the color-based option rather than the photo upload.
  3. Add the colors you want in the gradient — typically a handful of distinct hues works better than many similar ones, since mesh gradients blend adjacent colors into each other.
  4. Generate and review the result. Expect a soft, multi-directional blend where each color occupies a region and transitions into its neighbors.

If the first result looks muddy, the usual cause is colors that are too close in value or too many colors competing in one area. Reducing the count or increasing contrast between them usually cleans it up.

Generating from a photo

Upload an image and the tool derives the gradient from the colors in it. This is the better choice when you already have a reference — a photograph, a screenshot, a brand asset — and want the gradient to feel consistent with it. The trade-off is that you control the input image, not the individual colors, so fine-tuning a specific hue means changing the source image instead.

Which should you pick?

  • No suitable photo, or you need an exact palette: use colors.
  • You want the gradient to match an existing image or mood: use a photo.
  • You want to iterate quickly on hue combinations: use colors, since each change is a direct edit rather than a new upload.

One practical note: the site's own description covers both modes, but the page content itself is rendered by the app, so the exact controls and any limits on the number of colors or file size aren't visible from the static page. Check the interface after loading to confirm what's available.