SVG as a submit button
SVG is a great format for your web graphics and icons especially. There is a small trick how to use an inline svg image as a submit button inside your form.
First thing to do is to wrap your image inside a label
tag together with the submit button.
<form action="/search/" class="hide-submit" method="GET" >
<input name="q" type="text" />
<label>
<input type="submit" />
<svg xmlns="http://www.w3.org/2000/svg" ...>
<path d=" ..." />
</svg>
</label>
</form>
The label associates these two elements together, so if you click one of them it acts like you clicked on the another as well.
Lastly we need to hide the actual submit button with a simple CSS.
form.hide-submit input[type="submit"] { display: none;}
And we have an inline svg image that behaves like a submit button without any use of javascript.