Can you use interpolateColors on SVG fill?

[surgetom]

Hi guys,

Can you use interpolateColors on SVG fill?

I cant seem to find any examples online and i've tried so many ways to get it to work, but it just doesn't seems possible.

example of what i've tried.

const Svg = ( {}:SvgProps) => {
  const v = useSharedValue(0);

  const animatedProps = useAnimatedProps(() => {

  const fill = interpolateColors(v.value, {
      inputRange: [0, 1],
      outputColorRange: ["rgb(255,0,0)", "rgb(0,0,255)"],
    });

    const path = {SVG_PATH};
    return {
      d: path,
      fill:fill
    };
  });

  return (
    <Svg
      width="20"
      height="20 >
      <AnimatedPath animatedProps={animatedProps} />
    </Svg>
  );
};

export default Svg;

[GiridharKarnik]

this should work, you need to update the value of your shared value v. for example you can use withTiming.