JSFiddle - React, Tailwind, and code Playground

by Олег

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.3.1/css/foundation.min.css">
<div class="block">
		<div class="row">
			<div class="large-6 columns">
			  <div class="text c1">Текст примера Текст примера Текст примера Текст примера Текст примера Текст примера</div>
      </div>
		</div>
	</div>

CSS

.text {
	font-size: 2rem;
	line-height: 2rem;
  padding-left: 10rem;
  margin: 12rem 2rem;
	color: #425f6a;
	position: relative;
	z-index: 410;
}
.text:before {
	font-size: 30rem;
  font-family: "Akrobat";
  color: rgba(57, 170, 212, 0.4);
  line-height: 30rem;;
  text-align: center;
  z-index: 400;
	position: absolute;
	top: -12rem;
	left: 0;
	background-color: #fff;
	border-radius: 15rem;
  padding: 3rem;
  border:1px solid red;
}
.text.c1:before {
	content:"01";
  z-index:-100;
}