DEV Community

prajin10
prajin10

Posted on

How to import svg in next js and use it in src of Image tag from next/Image

So due to 100 of different way to import Image in Nextjs it is sometimes really confusing how to import svg in next js and use it in src of Image tag from next/Image. So here i am with just 4 steps

  • Paste the svg file in you asset folder as icon.svg.

  • Then in the file where you wan to use the svg import svg like below:

import icon from "../asset/icon.svg"
Enter fullscreen mode Exit fullscreen mode
  • Then to use the icon in Image tag as source do like below
  • U dont need to define width and height.

That's it if you like dont forget to comment and cheer me up

Top comments (0)