JSFiddle - React, Tailwind, and code Playground

by Q4Dizzy

HTML

<div class="price-md-block">
  <div class="wrap">
    <header class="price-md-block-header">
      <span>От:</span>
      <ins class="price">
        <strong>1370</strong>
        <span>грн/м<sup>3</sup></span>
      </ins>
    </header>
    <div class="content">+ доставка с <br>завода</div>
  </div>
</div>

CSS

.price-md-block {
  text-align: center;
  margin: 25px 0;
}

.price-md-block .wrap {
  display: inline-block;
  background-color: #70D438;
  border: 2px solid #3B608B;
  border-radius: 35px;
  box-shadow: 0 0 5px 5px #D6ECAE;
  color: white;
  padding: 15px 25px;
  font-family: Arial, sans-serif;
  font-size: 26px;
  font-weight: 500;
}

.price-md-block ins {
  text-decoration: none;
}

.price-md-block .price b,
.price-md-block .price strong {
  font-size: 38px;
  line-height: 1;
}

.price-md-block .price span {
  display: block;
}

.price-md-block .content {
  font-size: 20px;
}