useDark
Reactive dark mode with auto data persistence.
Package: @vueuse/core
Category: Browser
Usage
import { useDark, useToggle } from '@vueuse/core'
const isDark = useDark()
const toggleDark = useToggle(isDark)Options
| Option | Type | Default | Description |
|---|---|---|---|
| valueDark | string |
dark | Value applying to the target element when isDark=true |
| valueLight | string |
- | Value applying to the target element when isDark=false |
| onChanged | (isDark: boolean, defaultHandler: ((mode: BasicColorSchema) => void), mode: BasicColorSchema) => void |
undefined | A custom handler for handle the updates. |