1
resposta

[Dúvida] Consigo fazer madanca de cores de um site, dinamicamente, só usando Css... Veja exemplo..

:root {
  --cor: #ffffff;
}

body {
  color: var(--cor);
}

.troca:checked ~ :root {
  --cor: #000000;
}
1 resposta

Olá Victor! Tudo ok contigo?

Bom, a resposta é não! Você consegue fazer essa mudança desde que você aplique ela a itens filhos, agora aplicar a itens pais, ou mudar as variáveis, então nesse caso não é possível, isso, porque as variáveis CSS não são dinâmicas dessa forma. Uma vez definidas, elas não podem ser modificadas dinamicamente pelo usuário ou por meio de seletores como :checked.

Podemos alcançar esse resultado usando um código simples JavaScript, mas usando CSS só é possível alterar elementos filhos. Ou seja, uma tag input não pode modificar os estilos da tag body ou o seletor :root, mas se fosse uma tag no mesmo nível de hierarquia que ela, ou filha, nesse caso é possível.

Exemplo:

.troca:checked ~ label {
    background-color: #362980;
}

.troca:checked + ul {
    background-color: #ff00f0;
}

.troca:checked > span {
    background-color: #00f0f0;
}

.troca:checked strong {
    background-color: #f4e0b0;
}

Entre outras possibilidades.

Seria isso, se precisar eu estarei por aqui!

Abraços e bons estudos.