<div class=units>
	<div>trinket</div>
	<div>trinket</div>
</div>

/* reflection */
.units > :last-child {
	transform: rotatex(180deg) translatey(15px);
	mask-image: linear-gradient(transparent 50%, white 90%);
	-webkit-mask-image: linear-gradient(transparent 50%, white 90%);
	text-shadow: 0 0 8px rgba(255 0 0 / 0.4), -2px -2px 6px rgba(0 255 0 / 0.4),
		2px 2px 4px rgba(0 255 255 / 0.4);
	background-image: unset;
}
/* original design */
.units > * {
	font: bolder 5rem/5rem "EB Garamond";
	background-image: url(photo-1579268351234-073f85929562?w=200&q=80);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}
.units {
	width: max-content;
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	pointer-events: none;
	padding: 0 10px;
	display: inline-block;
}
body {
	text-align: center;
	margin-top: calc(50vh - 5rem);
}
/* This is a demo code only */