ColorChange.vue

<template>
  <h2 :style="{ color: color } "> COLOR CHANGING </h2>
</template>

<script setup>
import { ref, computed } from 'vue'
import { useTransition, TransitionPresets } from '@vueuse/core'

const source = ref([0, 0, 0])

const output = useTransition(source, {
  duration: 3000,
  transition: TransitionPresets.easeOutExpo,
})

const color = computed(() => {
  const [r, g, b] = output.value
  return `rgb(${r}, ${g}, ${b})`
})

source.value = [255, 0, 255]

</script>