usePreferredColorScheme

リアクティブな prefers-color-scheme メディアクエリ。

使用法

import { usePreferredColorScheme } from '@vueuse/core'

const preferredColor = usePreferredColorScheme()

コンポーネントでの使用

<template>
  <UsePreferredColorScheme v-slot="{ colorScheme }">
    Preferred Color Scheme: {{ colorScheme }}
  </UsePreferredColorScheme>
</template>