<div class="flag ally-pride" role="img" aria-label="Ally Pride Flag. Six bars of equal height in black and white. The traditional gay pride flag is on top cropped in an A shape"></div>
.flag {
  width: 80vmin;
  aspect-ratio: 70 / 45;
}

.flag.ally-pride {
  background: repeating-linear-gradient(black 0 16.66%, white 0 33.33%);
}

.flag.ally-pride::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background:
    linear-gradient(red 16.66%, orange 0 33.33%, yellow 0 50%, green 0 66.66%, blue 0 83.33%, indigo 0);
  clip-path: polygon(0 100%, 50% 0, 100% 100%, 66.66% 100%, 50% 66.66%, 33.33% 100%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.