.warning {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background:
    linear-gradient(60deg,transparent 50%,black 50%),
    linear-gradient(120deg,transparent 50%,yellow 50%),
    linear-gradient(180deg,transparent 50%,black 50%);
}
.warning::before{
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  background:
    linear-gradient(60deg,transparent 50%,yellow 50%),
    linear-gradient(120deg,transparent 50%,black 50%),
    linear-gradient(180deg,transparent 50%,yellow 50%);
  transform: rotate(180deg);
  clip: rect(100px 200px 200px 0);
  overflow: hidden;
}