<div class="egg">
  <div class="stripe"></div>
  <div class="stripe"></div>
  <div class="stripe"></div>
  <div class="stripe"></div>
  <div class="stripe"></div>
</div>
.egg {
  width: 140px;
  height: 200px;
  background: #FBE9E7;
  margin: 1em auto;
  
  border-radius: 50%/60% 60% 40% 40%;
  display: grid;
  overflow: hidden;
  grid-template-rows: repeat(5, 20%);
}

.stripe:not(:first-child) {
  border-top: 2px solid #fff;
}

.stripe:nth-child(1) {
  background-color: #FFBDE8;
}

.stripe:nth-child(2) {
  background-color: #BDE8FF;
}

.stripe:nth-child(3) {
  background-color: #E8FFBD;
}

.stripe:nth-child(4) {
  background-color: #FFE8BD;
}

.stripe:nth-child(5) {
  background-color: #E8BDFF;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.