Change Wordpress colors based on logo main color

Viewed 13

I'm trying to make a demo website where a user upload his logo and a title for his website and the website is automatically generated using what he entered.

I already figured how to make a demo website but i'm not sure on where to start to change colors (header, footer and menu) based on the logo main color.

Feel free to give me tips/ideas on where to start :)

1 Answers

First of all, you need colors from the image, you can use vibrant.js or any other js lib or you can write custom js code to extract colors from an image using JS, there are many articles on this topic.

the second thing you'll do that you will change your site styling system and will use css variables var(--varname) in every possible place that you want to be changed after image upload.

so once it's done, you'll grab the color from the image and then will change the values of css variables and the new color will be applied in your desired sections.

Related