JSFiddle - React, Tailwind, and code Playground

by rough cheap

HTML

<div class="outer">
  <div class="row">
    <div class="label">
      1TB
    </div>
    <div class="bar">
      <div class="bar-inner before">
        Windows
      </div>
    </div>
  </div>
  <div class="row">
    <div class="label">
      2TB
    </div>
    <div class="bar">
      <div class="bar-inner after">
        Windows
      </div>
    </div>

  </div>
</div>

CSS

body {
  padding: 1em 1em;
  background-color: #c9c9c9;
  font-family: 'Noto sans';
  font-size: 96px;
  font-weight: 900;
}
.outer {
  display: flex;
  flex-direction: column;
}
.row {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
  display: flex;
  flex-direction: row;
}
.label {
  width: 20%;
}
.bar {
  width: 80%;
}
.bar-inner {
  padding-left: .33em
}