I want to make a image using js with text and a photo like this Image . This is my code

//I have no idea how make this

<input type="text" id="name" placeholder="Enter Your Name">
<br>
<br>
</input><button id="btn">Click Me To Create The Image</button>

CodePudding user response：

My first idea would be to compose the image you want with a html canvas and then create a png from that.

You will have to do some reading on that. For example:

• html canvase: https://www.w3schools.com/html/html5_canvas.asp
• download image from canvase: Downloading Canvas element to an image