JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<div class="circle"></div>

CSS

html, body {
  background: black;
}

.circle {
  height: 50vmin;
  width: 50vmin;
  background:  linear-gradient(0deg, rgba(0,27,193,1) 0%, rgba(204,39,230,1) 50%, rgba(255,103,0,1) 75%, rgba(255,188,0,1) 100%);
  border-radius: 50vmin;
  margin: 25vmin auto;
  clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 0 50%, 0 60%, 100% 60%, 100% 70%, 0 70%, 0% 77%, 100% 77%, 100% 84%, 0 84%, 0 89%, 100% 89%, 100% 94%, 0 94%, 0 98%, 100% 98%, 100% 100%, 0 100%);
}