Coding with Rumaysa

Flower (Pure CSS!)

body {
background-color: #91b4ed;
}

.flower {
left: 50%;
position: absolute;
bottom: 0;
height: 100%;
width: 100%;
transform: translateX(-50%);
}

.pot {
background-color: #854d11;
width: 150px;
z-index: 1000;
position: absolute;
bottom: 0;
left: 41.7%;
height: 80px;
border-bottom-left-radius: 20%;
border-bottom-right-radius: 20%;
}

.stem {
width: 20px;
z-index: -1;
height: 260px;
border-top-left-radius: 20%;
border-top-right-radius: 20%;
border-bottom-left-radius: 20%;
border-bottom-right-radius: 20%;
position: absolute;
left: 50%;
bottom: 0;
background-color: #00c213;
}

.leaf {
width: 50px;
height: 50px;
background-color: #00c213;
border-radius: 0 70px;
position: absolute;
top: 66%;
left: 44.5%;
}

.leaf-two {
width: 50px;
height: 50px;
background-color: #00c213;
border-radius: 0 70px;
position: absolute;
top: 61%;
left: 51%;
transform: rotate(90deg);
}

.pollen {
background-color: #ffe921;
width: 60px;
height: 60px;
border-radius: 50%;
z-index: 1000;
top: 34.5%;
left: 47.2%;
margin-top: 20px;
position: absolute;
}

.petals * {
background-color: #b50067;
border-radius: 50%;
width: 90px;
position: absolute;
text-align: center;
height: 90px;
z-index: 5;
}

.petal-detail * {
background-color: #85004b;
border-radius: 50%;
width: 30px;
position: absolute;
text-align: center;
height: 30px;
z-index: 10;
}

.one {
top: 27.5%;
left: 40.5%;
}

.two {
top: 27.5%;
left: 50.5%;
}

.three {
top: 42%;
left: 40.5%;
}

.four {
top: 42%;
left: 50.5%;
}

.d-one {
top: 37.5%;
left: 45.5%;
}

.d-two {
top: 37.5%;
left: 52.5%;
}

.d-three {
top: 45%;
left: 45.5%;
}

.d-four {
top: 45%;
left: 52.5%;
}