Learn Advanced CSS

CSS Functions

body {
  display: flex;
  justify-content: space-around;
}

.conic {
  width: 200px;
  height: 200px;
  border-radius: 50%;
}

.first {
  background: conic-gradient(
    red,
    yellow,
    green,
    blue,
    purple
  );
}

.second {
  background: conic-gradient(
    red,
    yellow,
    green,
    blue,
    red
  );
}