JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.0.0-beta.11/chart.js"></script>
<canvas id="chart"></canvas>

JavaScript

const chart = new Chart("chart", {
	type: 'line',
  data: {
  	labels: ['A', 'B', 'C', 'D'],
    datasets: [{
    	label: 'DS1',
      data: [10, 20, 5, 0],
      backgroundColor: 'rgba(34, 139, 34, 0.5)',
      borderColor: 'rgba(34, 139, 34, 0.5)'
    }]
  },
	options: {
  	plugins: {
    	legend: {
      	labels: {
        	boxWidth: 100,
          pointStyle: 'line',
          usePointStyle: true,
        }
      }
    }
  }
})