Hi everyone!
I recently sent a prompt like this to API:
draw unicorn in TikZ
And got the following TikZ code as output:
\documentclass[tikz,border=3.14mm]{standalone}
\begin{document}
\begin{tikzpicture}
% Body
\fill[cyan!20] (0,0) ellipse (2.5 and 1.5);
% Head
\fill[cyan!20] (-3,1.5) circle (1);
% Eye
\fill[black] (-3.2,1.7) circle (0.1);
% Horn
\draw[thick, yellow!80!brown] (-3,2.5) -- (-3.2,1.8) -- (-2.8,2.5) -- cycle;
% Legs
\draw[thick] (-2,-1.5) -- (-2,-2.5);
\draw[thick] (-1,-1.5) -- (-1,-2.5);
\draw[thick] (1,-1.5) -- (1,-2.5);
\draw[thick] (2,-1.5) -- (2,-2.5);
% Tail
\draw[thick, pink] (2.5,-0.5) to[out=90,in=0] (2,0.5) to[out=180,in=90] (1.5,-0.5);
% Mane
\draw[thick, pink] (-3.5,1.5) to[out=90,in=180] (-3,2) to[out=0,in=90] (-2.5,1.5);
% Smile
\draw[thick] (-3.3,1.4) arc[start angle=180,end angle=360,radius=0.3];
\end{tikzpicture}
\end{document}
Which I use and use overleaf to get the output
Now, I’d like to know: How do I render and display the output of this TikZ code in React Js?
Any help or guidance would be greatly appreciated!
Thanks in advance!