JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="avatar"></canvas>

JavaScript

function draw() {
    var logo = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    logo.onload = function() {
        ctx.drawImage(logo, 0, 0);
    }
    logo.src = "http://nokosonline.com/dress-up/parts/logo.png";
    
    var body = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    body.onload = function() {
        ctx.drawImage(body, 0, 0);
    }
    body.src = "http://furryrpg.com/library/Bases/5.png";
    
    var hair = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    hair.onload = function() {
        ctx.drawImage(hair, 0, 0);
    }
    hair.src = "http://furryrpg.com/library/hair/95.png";
    
    var shoes = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    shoes.onload = function() {
        ctx.drawImage(shoes, 0, 0);
    }
    shoes.src = "http://furryrpg.com/library/boots/1.png";
    
    var dress = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    dress.onload = function() {
        ctx.drawImage(dress, 0, 0);
    }
    dress.src = "http://furryrpg.com/library/shirt/9.png";
    
    var pants = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    pants.onload = function() {
        ctx.drawImage(pants, 0, 0);
    }
    pants.src = "http://furryrpg.com/library/trousers/14.png";
    
    var ears = new Image();
    var canvas = document.getElementById("avatar");
    var ctx = canvas.getContext("2d");
    ears.onload = function() {
        ctx.drawImage(ears, 0, 0);
    }
    ears.src = "http://furryrpg.com/library/ears/2.png";

}

draw();