(Next.js) 如何在 next/image 中更改 SVG 的颜色？

Question

import Image from 'next/image'

...

<Image src="/emotion.svg" alt="emtion" width={50} height={50} />

我想更改 next/image 中的 SVG 颜色。

但在 CSS 中，

img {
  fill="#ffffff"
}

不工作。

我该如何解决这个问题？

Answer 1

我建议你不要直接使用svg文件，而是使用Playground SVG（https://react-svgr.com/playground/），将文件转换为JS，然后你可以通过props改变颜色和其他东西。