Dúvida sobre a solução

// -> Arquivo js :

const lista = document.querySelector('.lista')

document.querySelector('#mostrar').addEventListener('click', () => { lista.hidden = false })

document.querySelector('#ocultar').addEventListener('click', () => { lista.hidden = true })

// -> No Arquivo HTML colocar um ID em cada botão:

No primeiro botão para mostrar a lista de cores usei o Id = 'mostrar' e no segundo o Id = 'ocultar'.

Testei aqui e funcionou certinho!

Valeu, obrigado!

Achei a propriedade:

document.getElementById(id).style.visibility = "visible"; // show
document.getElementById(id).style.visibility = "hidden"; // hide

Tem também outras, nao sei se posso colocar o link, mas vou copiar aqui ai vc pode procurar

Use a propriedade style.visibility para ocultar / mostrar os elementos HTML Use a propriedade style.display para ocultar / mostrar os elementos HTML Use hide() / show() da jQuery para ocultar / mostrar os elementos HTML Use jQuery toggle() para ocultar / mostrar elementos HTML Use addClass() / removeClass() para ocultar / mostrar elementos HTML;

meu código ficou:

<button onclick="mostraTintas(this)" data-tintas >Aluratintas em estoque:</button>

  <ul class="lista">
    <li cor="laranja" tipo="tinta-exterior" class="item">Tinta laranja</li>

const tintas = document.querySelector('[data-tintas]');
const lista = document.querySelector('.lista');

var clique = true;

tintas.addEventListener('click', (evento) => {

if (clique == true) {
lista.style.visibility = "hidden";
clique = false;
}else{
lista.style.visibility = "visible";
clique = true}

})

também n havia conseguido pela solução! Obrigada

Vlw pela ajuda pessoal, apanhei p conseguir fazer esse esse desafio, estava errando uma parada boba do código.