Variáveis personalizadas para esquemas de cores

Acho que um recurso onde poderíamos adicionar variáveis CSS personalizadas aos esquemas de cores seria útil.

Meu caso de uso é que tenho um cabeçalho personalizado no meu fórum e quero que o logotipo da nossa empresa seja azul no esquema de cores claro e branco no esquema de cores escuro. Dado que não há como escrever CSS que tenha como alvo um esquema de cores específico, não vejo como posso fazer isso atualmente. O que eu poderia fazer é ter um tema escuro e um tema claro separados, mas então perco a capacidade de usar o modo escuro automático, que só pode alternar o esquema de cores e não o tema.

Alternativamente, apenas ter uma classe CSS em html ou body indicando o esquema de cores selecionado também resolveria esse problema, pois eu poderia escrever CSS direcionado ao esquema de cores específico.

1 curtida

Se você só precisar ajustar o logotipo, existem espaços dedicados para logotipos com esquema escuro nas configurações de back-end:

1 curtida

Você pode ter CSS que se comporta de maneira diferente em modo claro/escuro, se isso ajudar — temos uma folha de estilo especial chamada color_definitions… há um exemplo de como você pode usá-la aqui: Why might dark-light-choose() not work? - #2 by awesomerobot

6 curtidas

Obrigado, não sabia que já era possível, era exatamente o que eu precisava! O logo com tema escuro é um bom ponto também, não sabia que existia.

1 curtida