обходимо создать SVG pattern для заливки деталей дизайна.
имеем на входе образец

и текстуру


ожидаемый результат


понятно, что так не получится, но текстура должна repeat по горизонтали и на нее должен быть наложен градиент (blend?), который даст нужный рельеф
код на выходе
<svg>
<defs>
<pattern id="pattern" patternUnits="objectBoundingBox" width="100%" height="100%">
<image xlinkHref="pattern.jpg"/>
<filter ??> <gradient ??><faBlend???>
</pattern>
</defs>
<rect x=0 y=0 width=800 height=50 fill="url(#pattern)"></rect>
</svg>