JSFiddle - React, Tailwind, and code Playground

HTML

<div class="base-paper">
  <div class="main-text-box">
    <span class="main-text">ほげほげほげ</span>
  </div>
  <div class="sub-text-box">
    <span class="sub-text">ほげほげほげ</span>
  </div>
</div>

SCSS

.base-paper {
  max-height: 2.25em;
  max-width: 2em;
  background-color: #444;
  position: relative;
}

.main-text-box {
  overflow: hidden;
  max-height: inherit;
  .main-text {
    color: #fff;
  }
}

.sub-text-box {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  
  .sub-text {
      color: #444;
  }
}