English, asked by simran637795, 7 months ago

how we insert these types of emoji in brainy​

Attachments:

Answers

Answered by Anonymous
1

Answer:

try this one <!DOCTYPE html> <html lang="en"> <head> <title>Infinix</title> </head> <body> <div class="face"> <div class="forhead"> </div> <div class="cheeks"></div> <div class="ear"></div> <div class="eyebrow left"></div> <div class="eyebrow right"> </div> <div class="eye left"></div> <div class="eye right"></div> <div class="mouth"></div> <div class="shy"> </div> <div class="shy right"></div> </div> <style> body { background:#3e505e } .face { height: 600px; width: 350px; position: relative; margin: auto; } .face:before { content:''; background:black; height:122px; width:95px; position:absolute; z-index:6; left:210px; top:29px; border-radius:100% 190% 100% 0%; transform: rotate(-20deg); } .face:after { content:''; width:230px; height:180px; background:black; content:''; transform: rotate(-8deg); position:absolute; border-radius:100% 160% 100% 0%; left:70px; bottom:-14px; top:10px; z-index:5; } .forhead, .forhead:after { content: ''; width: 220px; height: 181px; background: #fbc6a3; content: ''; transform: rotate(-3deg); position: absolute; border-radius: 60% 120% 50% 0%; left: 67px; bottom: -14px; top: 21px; z-index: 6; } .forhead:after { width: 160px; height: 150px; border-radius: 150% 174% 159% 100%; transform: rotate(-20deg); top: 13px; left: 59px; border-top: 15px solid #fbc6a3; } .forhead:before{ background:#fbc6a3; width:60px; height:10px; content:''; position:absolute; z-index:7; left:105px; top:9px; transform: rotate(13deg); border-radius:100% } .ear { width:60px; height:50px; background:#fbc6a3; z-index:7; position:absolute; border-radius:300% 190% 200% 100%; transform: rotate(-20deg); top:110px; left:285px } .cheeks { background: #fbc6a3; width: 280px; height: 100px; border-radius: 50px 0px 50px 40px; transform: rotate(-3deg); position: relative; content: 'a'; top: 108px; left:10px } .cheeks:after { width: 297px; height: 100px; background: #fbc6a3; content: ''; transform: rotate(-3deg); position: absolute; border-radius: 100% 100% 100% 100%; left: 1px; bottom: -14px; } .eye { width:40px; height:40px; position:relative; background:black; border-radius:100%; animation: close-eye 4s none .2s infinite; } .eye:after { content:''; position:absolute; background:white; width:15px; height:15px; border-radius:100%; left:17px; top:12px; } .eye:before { content:''; position:absolute; width:70px; height:60px; border-radius:100%; border-top:2px solid black; left:-20px; margin-top:-20px; } .eye.left,.eye.right { position:absolute; top:80px; left:100px; z-index:10; } .eye.right { left:190px; top:90px; } .eyebrow { animation: eyebroani 2s linear .2s infinite; } .eyebrow,.eyebrow:after { position:absolute; width:20px; height:60px; background:black; z-index:8; border-radius:15px; transform: rotate(40deg); top:10px; left:90px; } .eyebrow:after { content:''; transform: rotate(-100deg); left:19px; margin-top:-23px; top:auto; } .eyebrow.right { left:180px; top:8px; transform: rotate(50deg); } .mouth { position:absolute; width:40px; height:40px; background:#76322f; border-radius:100%; top:180px; left:50px; z-index:8; } .shy { position:absolute; width:0px; height:0px; border-radius:100%; opacity:0; box-shadow: 0px 0px 40px 20px red; z-index:8; left:35px; top:160px; animation: shy 10s linear .2s infinite; } .shy.right { left:170px; top:180px; } @keyframes eyebroani { 0% {margin-top:auto} 10% {margin-top:-10px} 20% {margin-top:auto} 30% {margin-top:-10px} 40% {margin-top: auto} 100% {margin-top:auto} } @keyframes shy { 0% {opacity:0} 10% {opacity:0.2} 90% {opacity:0.2} 100% {opacity:0} } @keyframes close-eye { 0% { height: 40px; margin-top: auto; overflow: auto; } 5% { height: 2px; margin-top: 20px; overflow: hidden; } 5.1% { height: 40px; margin-top:0; overflow:visible; } } </style> </body> </html>

Answered by singhmohit097937
1

<!DOCTYPE html><html lang="en"><head><title>Koala</title></head><body><div class="character"><div class="head"><div class="ear ear-left"> </div><div class="ear ear-rigth"> </div><div class="eyes"></div><div class="nose"></div><div class="lip"></div></div><div class="body"><div class="hand hand-right"></div><div class="hand hand-left"></div></div></div><style>body {display: flex; justify-content: center; padding-top: 150px;}.character {position: relative;}.character .head {height: 125px; width: 155px; background: #94e1fd; border-radius: 80px 89px 55px 55px; position: relative; border: 4px solid black; top: 6px;}.character .head:after {content: ""; position: absolute; bottom: -43%; width: 40px; height: 50px; background: white; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; left: 42%;}.ear {width: 78px; height: 78px; background: white; border-radius: 38% 62% 57% 43% / 45% 48% 52% 55%; border: 4px solid black; position: absolute;}.ear-left {top: -24%; left: -24%; border-bottom-color: #94e1fd; transform: rotate(-49deg); box-shadow: inset 6px 20px 0px 12px #94e1fd, inset -20px 18px 0 0px #94e1fd, inset 3px -9px 0 0px #94e1fd; animation: ear-left 2s infinite linear;}.ear-left:before {content: ""; width: 4px; height: 6px; border-radius: 50%; background: black; position: absolute; top: 31px; left: 110%; transform: rotate(-76deg); box-shadow: 15px 12px, 30px 0px; opacity: 0; animation: ear-left-after 2s infinite linear;}.ear-rigth {left: 65%; top: -24%; transform: rotate(-227deg); z-index: -1; box-shadow: inset 20px -4px 0px 13px #94e1fd, inset 20px -11px 0 0px #94e1fd, inset 20px 19px 0 0px #94e1fd; animation: ear-right 2s infinite linear;}.eyes {width: 14px; height: 10px; background: black; position: absolute; border-radius: 50%; top: 46%; left: 28%; box-shadow: 65px 0px; animation: eyes 2s infinite linear;}.eyes:after {content: ""; width: 14px; height: 3px; background: black; position: absolute; border-radius: 50%; bottom: -57%; box-shadow: 65px 0px;}.nose {width: 31px; height: 35px; background: #6f69ef; border-radius: 53% 47% 59% 41% / 73% 76% 24% 27%; border: 4px solid; position: absolute; top: 43%; left: 43%; animation: nose 2s infinite linear;}.lip {width: 34px; height: 4px; background: black; position: absolute; border-radius: 25%; top: 83%; left: 45%; animation: lip 2s infinite linear;}.body {position: relative; z-index: -1;}.body:after, .body:before {content: ""; border-radius: 50%; width: 44px; height: 105px; border: 4px solid; position: absolute; background: #94e1fd; border-right-color: transparent; left: 24%; top: -8px;}.body:after {left: 46%; border-left-color: transparent; border-right-color: black;}.hand {border-right-color: transparent; width: 34px; height: 55px; border-radius: 71% 29% 22% 78% / 17% 78% 22% 83%; background: #94e1fd; border: 4px solid; position: absolute; left: 8%; top: -2px; border-top-color: #94e1fd; transform: rotate(39deg);}.hand-left {left: 63%; transform: rotate(-27deg); border-radius: 59% 41% 32% 68% / 20% 62% 38% 80%; border-left-color: transparent;}@keyframes eyes {100% {height: 30px; top: 22%; width: 10px;}}@keyframes nose {100% {top: 22%;}}@keyframes lip {100% {background: #f77676; height: 25px; width: 25px; top: 72%; border-top-left-radius: 50%; border-top-right-radius: 50%; transform: translateY(-10px);}}@keyframes ear-left {100% {border-bottom-color: black; top: 165%; transform: rotate(-175deg); height: 24px;}}@keyframes ear-right {100% {top: 165%; transform: rotate(-175deg); height: 24px;}}@keyframes ear-left-after{95%{opacity: 0;}100%{opacity: 1;}}</style></body></html>

Previous Question
Next Question
Similar questions
Physics, 3 months ago
The word polymer is derived from _________​...
Hindi, 3 months ago
ऑनलाइन क्लास पढ़ाई के लिए आपको एक नए अच्छे फोन की जरूरत है पिताजी को पत्र इन हिंदी ​...
English, 3 months ago
fill in the blanks with the correct auxiliaries (a).one...............respect the law of the land. (b).he has travelled a lot.he.............speak four languages. (c).where is ram?he..............be having lunch. (d)..............you wait a movement,please? (e).we..............have reserved the table.​
Chemistry, 7 months ago
E. Write True or False : 1. The wool fibre is made of cellulose. 2. Yolk is the oily substance of sheep. 3. More the crimps per unit length, worse is the quality. 4. The process of removal of wool from sheep is called realing. 5. Sericulture is rearing of silkworms to get silk. 6. Silk is a synthetic fibre. 7. Throwing is a way of twisting silk thread.​
Math, 7 months ago
class 8 rational number exercise 1A7:20 इन द ब्लैंक्स विथ द करेक्ट असेंबल आउट ऑफ ​...
Math, 10 months ago
What is the measure of each interior angle of a pentagon?
Environmental Sciences, 10 months ago
What natural resources are renewable and nonrenewable?
Social Sciences, 10 months ago
What percentage of world population lives in asia?