Lemon shape (CSS and HTML) - Stack Overflow

PHOTO EMBED

Sun May 02 2021 20:47:26 GMT+0000 (UTC)

Saved by @bilgehanevren #css

body {
  background: rgb(48, 52, 52)
}
.container {
  margin: 0 auto;
  width: 200px;
  position: relative;
}
.leaves {
  width: 7px;
  height: 70px;
  background: #339B00;
  border-radius: 0 0 10px 10px;
  position: absolute;
  left: 50%;
  margin-left: -4px;
  z-index: 1;
}
.leaves:after {
  content: '';
  width: 80px;
  height: 80px;
  background: #339B00;
  position: absolute;
  border-radius: 0% 50%;
  transform: rotate(96deg) skew(21deg, 11deg);
  transform-origin: left top;
  top: 32px;
}
.leaves:before {
  content: '';
  width: 70px;
  left: 8px;
  height: 70px;
  background: #339B00;
  position: absolute;
  border-radius: 0% 50%;
  transform: rotate(-16deg) skew(21deg, 11deg);
  transform-origin: left top;
  top: 32px;
}
.lemon {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: yellow;
  position: absolute;
  transform: rotate(48deg) skew(6deg, 6deg);
  top: 69px;
  left: 50%;
  margin-left: -80px;
}
.lemon:after {
  content: '';
  width: 50px;
  height: 50px;
  background: yellow;
  top: 64%;
  left: 50%;
  position: absolute;
  margin-left: 24px;
  border-radius: 19px;
}
content_copyCOPY

https://stackoverflow.com/questions/27874354/lemon-shape-css-and-html