<section>

  <h2>size: 30%</h2>

  <div class="section image size-one"></div>

</section>

​

<section>

  <h2>size: 100px 200px</h2>

  <div class="section image size-two"></div>

</section>

body {

  display: grid;

  grid-template-columns: 1fr 1fr;

  grid-gap: 30px;

  font: 14px/1.5 monospace;

}

​

.section {

  height: 200px;

  background: #ffeb3b;

}

​

.image {

  background-image: url(https://assets.codepen.io/1425525/Hexlet_Logo-01-svg__1_.png);

  background-repeat: no-repeat;

}

​

.size-one {

  background-size: 30%;

}

​

.size-two {

  background-size: 100px 200px;

}