ReactJS - Converting SVG files to PNG

Viewed 143

I'm using the program DiceBear to generate an avatar using .svg files. The program pulls .svg files from a library and layers them on top of eachother using a createAvatar function.

How could it be written so the end result is rasterized into a single png?

    import { createAvatar } from '@dicebear/avatars';
    import * as style from '@dicebear/avatars-male-sprites';
    import * as React from 'react';
    import SVG from 'react-inlinesvg';

    import Layout from '@/components/layout/Layout';
    import Seo from '@/components/Seo';


    export default function HomePage() {
      const svg = createAvatar(style);

      console.log(svg);
      return (
        <Layout>
          <Seo />

          <main>
            <section className='bg-dark'>
              <div className='flex flex-col items-center justify-center min-h-screen text-center text-white layout'>
                <SVG src={svg} />
              </div>
            </section>
          </main>
        </Layout>
      );
    }
0 Answers
Related