Estatística com anel

.card-062 {
  display: flex;
  align-items: center;
  gap: 18px;
  width: 300px;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  font-family: system-ui,sans-serif;
  color: #111827
}
.card-062__ring {
  flex: none;
  width: 80px;
  height: 80px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(#8b5cf6 0 72%,#ede9fe 72% 100%);
  transition: filter .2s
}
.card-062__ring::before {
  content: "";
  grid-area: 1/1;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: #fff
}
.card-062__ring b {
  grid-area: 1/1;
  font-size: 16px;
  font-weight: 700;
  color: #5b21b6
}
.card-062:hover .card-062__ring {
  filter: saturate(1.3)
}
.card-062 h3 {
  margin: 0 0 2px;
  font-size: 15px
}
.card-062 p {
  margin: 0 0 8px;
  font-size: 13px;
  color: #6b7280
}
.card-062 a {
  font-size: 13px;
  font-weight: 600;
  color: #7c3aed;
  text-decoration: none
}
.card-062 a:hover {
  text-decoration: underline
}
.card-062 :is(a,button,input,select,textarea):focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

<article class="card-062">
  <div class="card-062__ring"><b>72%</b></div>
  <div class="card-062__text"><h3>Storage used</h3><p>36 GB of 50 GB</p><a href="#">Manage</a></div>
</article>