Minha solução

const buttonExibir = document.querySelector("[data-exibir]");
const buttonEsconder = document.querySelector("[data-esconder]");
const cores = document.querySelectorAll("[cor]");

buttonExibir.addEventListener("click", () => {
  mostraTintas();
});

buttonEsconder.addEventListener('click', () => {
  esconderTintas();
})


function mostraTintas(){

    cores.forEach((elemento) => {
      elemento.style = "visibility:visible";
    });
}

function esconderTintas(){
    cores.forEach((elemento) =>{
      elemento.style = "visibility:hidden";
    });
}

Fiz a busca dos botões usando data-attributes, e também cada item da lista busca pelo atributo cor. Tive preferência por usar a propriedade visible do css, já que o espaço da div continua sendo preenchido. Sinto que esse código pode ficar ainda melhor , se alguém tiver uma sugestão.