JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="https://github.com/highslide-software/highcharts.com/raw/master/js/highcharts.src.js"></script>
<script type="text/javascript" src="https://github.com/highslide-software/highcharts.com/raw/master/js/modules/exporting.src.js"></script>
<script type="text/javascript" src="http://highcharts.com/js/modules/funnel.src.js"></script>

<div id="container" style="height: 400px; width: 600px"></div>

<!--
<button id="button">Button</button>
-->

JavaScript

var chart;
var options = {
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'funnel',
        margin: [50, 10, 60, 170],
        borderWidth: 1
    },
    title: {
        text: 'Sales funnel'
    },
    plotArea: {
        shadow: null,
        borderWidth: null,
        backgroundColor: null
    },
    tooltip: {
        formatter: function() {
            return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.y, 0);
        }
    },
    plotOptions: {
        series: {
            dataLabels: {
                align: 'left',
                x: -300,
                enabled: true,
                formatter: function() {
                    return '<b>'+ this.point.name +'</b> ('+ Highcharts.numberFormat(this.point.y, 0) +')';
                },
                color: 'black'
            },
            
            neckWidth: '30%',
            neckHeight: '25%'
        }
    },
    legend: {
        enabled: false
    },
    series: [{
        name: 'Browser share',
        data: [
            ['Website visits',   1654],
            ['Downloads',       1064],
            ['Requested price list', 987],
            ['Invoice sent',    76],
            ['Finalized',    46]
        ]
    }]
};


$(document).ready(function() {
    chart = new Highcharts.Chart(options);
});