JSFiddle - React, Tailwind, and code Playground

HTML

<div class="article">
  <ul id="textasiat2">
    <li><a href="#">ce lien sera</a></li>
    <li><a href="#">Ce lien sera</a></li>
    <li class="designer"><a href="#">nouveau style</a></li>
    <li><a href="#">nouveau style</a></li>
  </ul>
  <img class="imagasiat" src="images/asiat.jpeg" alt="asiat">
</div>

CSS

.designer {
  color: white;
  text-shadow: 2px 2px 4px #000000;
  font-size: 4vw;
  line-height: 4vw;
  margin-top: 2em;
}

.designer li a {
  -webkit-transition: color 2s, font-size 2s;
  -moz-transition: color 2s, font-size 2s;
  -o-transition: color 2s, font-size 2s;
  transition: color 2s, font-size 2s;
}

.designer li a:hover {
  font-size: 20vw;
  color:
    #FAFAD2;
}