Можно вручную, есть редакторы разного плана, можно через canvas. На codepen можешь ввести canvas animation и посмотреть примеры, может сумеешь адаптировать под себя. Из редакторов бесплатных знаю только на mac - Keyshape Beta.
<path
d="m 648.6,575 c -0.5,0 -0.9,-0.4 -1,-0.9 -0.1 z
m 648.6,575 c -0.5,0 -0.71,-1.4 -1,-3.9 -0.4 z
m 548.4,575 c -1.5,0 -4.71,-1.4 -1,-3.9 -1.1 z
"/>
В мозиле нужно кроме svg нужно через css указать для id или class в них clip-path со значениями polygon, разделить все значения на 100 и добавить значок процента. Читай инфу по clip-path. У тебя все получится.
Вот практически все что есть на эту тему на Youtube. У некоторых видео есть в описании презентации и ссылки на статьи, так что дерзай. Помимо Corel Draw есть Inscape (бесплатный, много уроков в группах вконтакте) и adobe illustrator, есть плагин для работы с svg в photoshop от sourse (тут придется погуглить и найти). https://www.youtube.com/playlist?list=PLwSqIhGzeV0...
Как насчет использовать альтернативный id или class для svg уже при добавлении материала через систему управления, сделайте checkbox "включить если фон белый". или при наведении выводить крестик за пределы картинки, чтобы он наверняка был виден.
