JSFiddle - React, Tailwind, and code Playground

HTML

<div class="contenedor">
    <div class="barra">
          <div class="color" style="width:50%;"></div>
          <div class="texto">Photoshop</div>
    </div><br>
    <div class="barra">
        <div class="color" style="width:90%;"></div>
        <div class="texto">InDesing</div>
    </div><br>
    <div class="barra">
        <div class="color" style="width:20%;"></div>
        <div class="texto">Illustrator</div>
    </div>
</div>

CSS

.contenedor{
	width:500px;
}
.barra{
	position:relative;
	height:30px;
	background-color:#D5D5D5;
	width:100%;
	padding-top:5px;
}
.texto{
	position:absolute;
	padding-top:4px;
	padding-left:10px;
}
.color{
	position:absolute;
	background-color:#00BDE4;
	height:25px;
}