background gradient в div

У меня есть картинка с градиентом на заднем фоне. Она находится в блоке div, в котором background справа должен быть продолжением градиента картинки. Попробовал сделать но на фоне все равно видно отличие в цветах. Pribor

 <div class="banner">
      <img src="../images/pribor.jpg">
    </div>
    .banner {
      width: 100%;
      display: flex;
      background: linear-gradient(14deg, rgba(87,114,181,1) 0%, rgba(53,151,222,1) 94%);
    }

Ответы (1 шт):

Автор решения: Dzorogh

Вы добавили лишние 14 градусов в наклоне фона и не попали в точки остановки цветов.

Но лучше, конечно использовать png без фона (или даже webp).

img {
  height: 400px;
  display: block;
}

.container {
  background: linear-gradient(0deg, #5c73af 16%, #5099db 91%);
}
<div class="container">

  <img src="https://i.stack.imgur.com/9YmQD.png">

</div>

→ Ссылка