The ColorModeSwitch component extends the Switch component, so you can pass any property such as color, size, etc.
<template>
<PColorModeSwitch />
</template>
Use the app.config.ts to customize the icon with the pohon.icons property:
export default defineAppConfig({
pohon: {
icons: {
light: 'i-ph:sun',
dark: 'i-ph:moon'
}
}
})
Use the vite.config.ts to customize the icon with the pohon.icons property:
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import pohon from '@nuxt/ui/vite'
export default defineConfig({
plugins: [
vue(),
pohon({
pohon: {
icons: {
light: 'i-ph:sun',
dark: 'i-ph:moon'
}
}
})
]
})
| Prop | Default | Type |
|---|