Components
Mode Toggle
A theme switcher for toggling between light, dark, and system themes
A theme toggle component that allows users to switch between light, dark, and system color modes.
Usage
Mode Toggle Design
In components/shared/mode-toggle.tsx
you can find the three pre-defined
design of mode toggle component.
Tips
- Place the mode toggle in a consistent location across your application like default showig on header
- Consider using icons that clearly represent light and dark modes
- Include a system preference option to respect user's device settings
- Ensure your application's colors work well in both light and dark modes