Jump to content

How to generate complex Multi-Color-Gradients with PHP?


Recommended Posts

Hello guys,
I'm trying to do that for a while but nobody is able to help me. ;)

How can I achieve to create images with PHP that look like these Multi Color Gradients?


The patterns should defined by positions in the field. It's important that they aren't linear or circled. It needs to be a complex pattern.

Any help would be amazing! Thank you :)

Link to comment
Share on other sites

1 hour ago, requinix said:

Looks like multiple linear and/or radial gradients.

How are you at math? You'll need some. More than some.


3 hours ago, Barand said:

As gradients come in two flavours - linear and radial, then good luck with that.

Thanks for your advices. :) Sounds like it will get difficult...


The plan is to create a grid. Let's say 200x200 px. Now you can set points there. For example (50/100) (150/100). These points can get a hex code and with them the gradient will get created. :) (Like the current Illustrator version is doing it.)


The UI can include the feature to movr the points with the mouse on the gird and to create new points. 

Link to comment
Share on other sites

1 hour ago, requinix said:

You should do this with Javascript and canvas, not PHP.

But you'll still have to come up with the math to do what you want. I'm thinking parametric equations. Fun stuff.

I think that is an good idea. I'll give myself a try later that day :)

Link to comment
Share on other sites

There are some fairly complex things that you can do with CSS gradient backgrounds. Perhaps one of the following links will provide some inspiration:

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.