Diseño visual aplicado - Ajusta el matiz de un color

Cuéntanos qué está pasando:
Describe tu problema en detalle aquí.

No entiendo que falla con mi codigo

  **Tu código hasta el momento**
<style>
body {
  background-color: #FFFFFF;
}

.green {
  background-color: hsl(120, 100 %, 50 %);
}

.cyan {
  background-color: hsl(180, 100 %, 50 %);
}

.blue {
  background-color: hsl(240, 100 %, 50 %);
}

div {
  display: inline-block;
  height: 100px;
  width: 100px;
}
</style>

<div class="green"></div>
<div class="cyan"></div>
<div class="blue"></div>
  **Información de tu navegador:**

El agente de usuario es: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.102 Safari/537.36

Desafío: Diseño visual aplicado - Ajusta el matiz de un color

Enlaza al desafío:

Es solo un pequeño error de formateo, el % debe ir junto al número, sin separarlo con espacio