JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>
<div class="chart-container">
  <canvas id="chart"></canvas>
</div>

CSS

.chart-container {
  /* transform: rotate(1.5deg); */
}

JavaScript

const ctx = document.getElementById('chart').getContext('2d');
const myChart = new Chart(ctx, {
  type: 'polarArea',
  data: {
    datasets: [{
      data: [10, 20, 30],
      backgroundColor: [
        'hsla(0, 50%, 50%, 0.5)',
        'hsla(120, 50%, 50%, 0.5)',
        'hsla(240, 50%, 50%, 0.5)',
      ],
      borderColor: [
        'hsla(0, 50%, 50%, 0.9)',
        'hsla(120, 50%, 50%, 0.9)',
        'hsla(240, 50%, 50%, 0.9)',
      ]
    }],
    labels: [
      'One',
      'Two',
      'Three'
    ]
  },
  options: {
  	layout: {
    	padding: 5
    },
    legend: {
      display: false
    },
    scale: {
      angleLines: {
        display: true
      },
      ticks: {
        display: false
      }
    },
    /* startAngle: -0.509 * Math.PI */
  }
});