Changing Icon colors

773 views
Skip to first unread message

shoq

unread,
Jun 6, 2022, 10:50:08 PM6/6/22
to diagrams.net Q&A
I really like DrawIo, and really hate it often,  too. So much potential, but the learning curve is so steep.  
After years of trying, I still can't change the foreground color of PNG icons, and if I cannot do that, no one ever seems to say so directly. But I assume they must be changeable because what good are they if they can't be customized?  Many great icons have awful colors, and all I can ever set is backgrounds and borders. Is there any way (short of editing a copy of the original PNG), to replace the foreground object color?  I just can't believe all the developers using this product are using the random icon colors supplied with the PNGs that come with the app. What am I doing wrong (if anything)?



2022-06-06_22h40_45.jpg


Kartik Shah

unread,
Jun 7, 2022, 12:18:52 AM6/7/22
to diagrams.net Q&A
Hi,

There is no way to change the image. I faced the same challenge and then I realized that the best way to do it was to convert the image to a drawio shape and then use it.

The process is a bit tedious but I found it worthwhile to do it for my commonly used icons. The steps are:

  1. Convert the image to an SVG file first (if you do not have the svg version)
  2. Use SVG2XML (https://github.com/jgraph/svg2xml) to convert it to XML
  3. Open the file in a text editor
  4. In Drawio go to add shape (Arrange -> Insert -> Shape)
  5. Replace the XML from that in the XML file (remember to only take the child shape element and not the root shapes element)
  6. The shape shows up on the drawio canvas and not it is completely editable.
  7. Add it to your custom shapes to make it available in the future easily 
Cheers

Regards,

Kartik
____________________________
Kartik Shah
karti...@gmail.com

On 07-Jun-2022, at 08:20, shoq <shoq...@gmail.com> wrote:

I really like DrawIo, and really hate it often,  too. So much potential, but the learning curve is so steep.  
After years of trying, I still can't change the foreground color of PNG icons, and if I cannot do that, no one ever seems to say so directly. But I assume they must be changeable because what good are they if they can't be customized?  Many great icons have awful colors, and all I can ever set is backgrounds and borders. Is there any way (short of editing a copy of the original PNG), to replace the foreground object color?  I just can't believe all the developers using this product are using the random icon colors supplied with the PNGs that come with the app. What am I doing wrong (if anything)?



<2022-06-06_22h40_45.jpg>



--
You received this message because you are subscribed to the Google Groups "diagrams.net Q&A" group.
To unsubscribe from this group and stop receiving emails from it, send an email to drawio+un...@googlegroups.com.
To view this discussion on the web, visit https://groups.google.com/d/msgid/drawio/0484ca66-24c3-45f4-ac85-16fbef97c9cdn%40googlegroups.com.
<2022-06-06_22h40_45.jpg>

Reply all
Reply to author
Forward
0 new messages