JSFiddle - React, Tailwind, and code Playground

HTML

<div class="text-price">
		<span>п</span>
		<span>р</span>
		<span>а</span>
		<span>й</span>
		<span>с</span>
	</div>

CSS

.text-price {
			text-align: center;
			padding-top: 80px;
			padding-bottom: 80px;
		}
		.text-price span {
			display: inline-block;
			transition: transform 0.6s ease-in-out;
		}
		.text-price:first-child {
			transform: translateY(10px);
		}
		.text-price:nth-child(2) {
			transform: translateY(-10px);
		}
		.text-price:nth-child(3) {
			transform: translateY(0px);
		}
		.text-price:nth-child(4) {
			transform: translateY(10px);
		}
		.text-price:last-child {
			transform: translateY(15px);
		}