JSFiddle - React, Tailwind, and code Playground

HTML

<dl class="skills">
  <dt>Adobe Photoshop</dt>
  <dd>
    <div class="skill-item" style="width: 60%;"></div>
  </dd>
</dl>

CSS

.skills dd {
  margin: 0 0 20px 0;
  
  background-color: #F5F5F5;

  border-radius: 50px;
}

.skills dt {
  margin-bottom: 5px;
  
  color: #333;
  font-size: 14px;
  font-weight: bold;  
}

.skill-item {
  height: 5px;
  
  background-color: #4470c4; 
  border-radius: 50px;
}