ColorModeAvatarPRO

AvatarGitHub
An Avatar with a different source for light and dark mode.

Usage

The ColorModeAvatar component extends the Avatar component, so you can pass any property such as size, icon, etc.

Use the light and dark props to define the source for light and dark mode.

<template>
  <UColorModeAvatar light="https://github.com/vuejs.png" dark="https://github.com/nuxt.png" />
</template>
Switch between light and dark mode to see the different images:

API

Props

Prop Default Type