动态改变图像颜色

Question

动态改变图像颜色

Prz*_*mek 5 javascript css php jquery image-processing

我正在开发一个应用程序,它将多个视图显示为表格(例如客户,产品等).每行的最后一列包含按钮,用户可以使用这些按钮对特定行执行某些操作.简化示例:

<td class="actions">
  <a href="projects/some-project/edit">
    <img src="images/edit-project.png" alt="Edit project" />
  </a>
  <a href="projects/some-project/do-something">
    <img src="images/someaction.png" alt="Do something else with the project" />
  </a>
</td>

Run Code Online (Sandbox Code Playgroud)

图像是透明的png.每张桌子的按钮数量可能会有所不同,现在总共大约有30个.

我被要求在应用程序css样式中进行更改,因此不同的表现在可以有不同的颜色,例如,customers表现在有一些粗糙的色调,项目一个是蓝色等等.而且,"奇数"表格行的颜色与"偶数"表格略有不同.如果选择它们,行也会更改颜色.

问题是该设计指出按钮必须随行改变颜色.这需要制作许多按钮 - 颜色组合,并且将来会添加更多按钮.

我认为比分配设计师制作不同颜色的数百个按钮版本更好的方法是动态制作,具体取决于表类.我的问题是 - 最有效的方法是什么？该应用程序使用PHP作为服务器端语言和javascript与客户端jQuery.图像的问题是它们不是单色而是使用多种颜色,因此我必须根据css类操作它们的HSL.

如果使用php更好的方法,我可能会使用ImageMagick.问题是获取与所提供颜色非常接近的图像的最佳方法是什么.