JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>

<div id="pred_area_js" style="height: 400px"></div>

JavaScript

Highcharts.setOptions({
                     colors: ['#FD625E' , '#69D7C6' , '#573755', '#A3ABB7']
                    });


                $('#pred_area_js').highcharts({
                    chart: {
                        type: 'pie',
                        options3d: {
                            enabled: true,
                            alpha: 45
                        }
                    },
                    //colors: ['#FD625E' , '#69D7C6' , '#573755', '#A3ABB7'],
                    title: {
                        text: 'title'
                    },
                    subtitle: {
                        text: 'subtitle'
                    },
                    plotOptions: {
                        pie: {
                            innerSize: 100,
                            depth: 45
                        }
                    },
                    series: [{
                        name: 'chart name',
                        animation: {
                            duration: 2000
                        },
                        data: [
                            ['Data1', 1634],
                            ['Data2', 1403],
                            ['Data3', 1085],
                            ['Data4', 48]
                        ]
                    }]
                });