Как правильно на css сделать фильтр?
Вложений: 2
Всем привет. Ребята, подскажите, пожалуйста, как на css сделать следующую задачу. У меня есть исходное изображение: init.png
И есть, например цвет: #2e305f. Мне необходимо наложить этот цвет на исходное изображение и получить следующий результат: filter.png |
Можно при помощи 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,
:thanks: |
Большое спасибо.
|
| Часовой пояс GMT +3, время: 23:36. |