Usando
Como Habilitar o Modo Escuro
Usando rocketicons para estilizar ícones no modo escuro.
Você pode estilizar os ícones de forma diferente quando modo escuro está ativado.
Modo claro
Modo escuro
<divclassName="text-slate-400 bg-slate-800 ... shadow-xl"><p>{modeLabel}</p><SlFireclassName="icon-sky-900-6xl dark:icon-sky-500-6xl" /></div>Em ação
Uso da variante dark
Use a variante dark: para definir estilos no modo escuro.
Mude o tema da página e veja o que acontece.
No documentação oficial do Tailwind você encontra uma referência completa do uso do mudo escuro.