JSFiddle - React, Tailwind, and code Playground

HTML

<div class="fast-view-button">
   <p class="fast-view-button-text">838282838238<br>0000</p>
</div>
<div class="fast-view-button">
   <p class="fast-view-button-text">op<br>32423</p>
</div>
<div class="fast-view-button">
    <p class="fast-view-button-text">Dlinnaya<br>stroka</p>
</div>

CSS

.fast-view-button {
	width: 152px;
	height: 152px;
	background-color: #232323;
	border-radius: 50%;
	display: inline-block;
  position: relative;
}

.fast-view-button:hover {
	cursor: pointer;
	background-color: #294386;
	color: #294386;
	transition: all 0.5s ease 0s;
}

.fast-view-button:hover p {
	color: red;
	transition: all 0.5s ease 0s;
}

.fast-view-button-text {
	position: absolute;
	bottom: 20px;
	color: green;
	font-size: 25px;
	font-weight: 400;
	text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 50%;
  height: 30%;
  margin: auto;
}