Как правильно на css сделать фильтр?

[gsdev99]

Всем привет. Ребята, подскажите, пожалуйста, как на css сделать следующую задачу. У меня есть исходное изображение: init.png
И есть, например цвет: #2e305f. Мне необходимо наложить этот цвет на исходное изображение и получить следующий результат: filter.png

[Malleys]

Можно при помощи SVG-фильтра, если вам нужно применить к <img>...

<style>

img {
	-webkit-filter: url(#opacity);
	filter: url(#opacity);
}

</style>
<img src="https://i.imgur.com/OE1rGv9.jpg">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
	<defs>
		 <filter id="opacity">
			 <feColorMatrix type="matrix" color-interpolation-filters="sRGB"
					values="0.03 0    0    0.17 0
					        0    0.03 0    0.17 0
					        0    0    0.03 0.38 0
					        0    0    0    1    0 " />
		 </filter>
	</defs>
</svg>

или при помощи градиента, если к фону...

<style>

html {
	background:
		linear-gradient(rgba(18%, 18%, 37%, .97), rgba(18%, 18%, 37%, .97)),
		url("https://i.imgur.com/OE1rGv9.jpg")
	;
}
	
</style>

[рони]

Malleys,

[gsdev99]

Большое спасибо.