JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="product_card">
  <img class="image" src="https://mega-blitz.ru/templates/Default/images/resource/Object252.png" alt="Lowe">
<span class="text">НАЗВАНИЕ</span> 
  
  
</div>
  
  
</body>

CSS

body{
  margin: 0;
  padding: 0;
  color: #fff;
}
.product_card{
  position: relatie;
  width: 280px;
  height: 198px;
  background: #333;
  float: left;
}
.image{
  max-width: 80%;
  background-image: url(https://static-pss-ru.wgcdn.co/shop/static/3.85.0/frontend/images/blocks/item/item_image_flag__ussr.png);
  background-repeat: no-repeat;
  background-position: center center;
}
.price{
   position:absolute;
   bottom:0;
   font-size: 40px;
   color: #fff;
   margin-left: 10px;
}
.text{
  text-align: left;
  font-size: 40px;
  font-family: Tahoma, sans-serif;
}