JSFiddle - React, Tailwind, and code Playground

by Josh Pullen

HTML

<span>4</span>
<span>524</span>

CSS

body {
  margin: 50px;
  font-family: sans-serif;
  letter-spacing: 0.1em;
}

span {
  font-size: 32px;
}

span:last-of-type {
  border-top: 2px solid black;
  position: relative;
  padding-left: 12px;
  padding-right: 6px;
}

span:last-of-type::before {
  content: "";
  display: inline-block;
  
  position: absolute;
  top: -2px;
  left: 0;
  bottom: 0;
  width: 12px;
  transform: translateX(-60%);
  border-radius: 50%;
  border-right: 2px solid black;
}