Sistema de Temas

Tema Atual

Você está usando o tema: light

O tema é aplicado em toda a aplicação, incluindo o elemento <html>

Card Primário

Este é um exemplo de card usando as cores do tema.

Card Secundário

Cores secundárias também mudam com o tema.

Card Accent

Veja como as cores de destaque se adaptam.

Alert Success
Alert Warning
Alert Error
Alert Info

Badges

neutral
primary
secondary
accent
ghost
info
success
warning
error

Botões

Como Funciona

1. Script Inline (_document.tsx)

Aplica o tema imediatamente ao carregar, antes do React hidratar.

2. ThemeContext

Gerencia o estado global do tema na aplicação.

3. LocalStorage

Persiste a preferência do usuário entre sessões.

4. Atributo data-theme

Aplicado no elemento <html>, permite que DaisyUI aplique os estilos.