Как сделать улыбку смайлика на HTML+CSS?

Question

[Владислав Михайлов]

Есть смайлик, как сделать такую улыбку?

Answer 1

[Justique]

HTML

<div class="mouth1"></div>
<div class="mouth2"></div>

CSS

.mouth1 {
    background-color: #fff;
    position: absolute;
    left: 100px;
    top: 155px;
    width: 200px;
    height: 200px;
    border-radius: 100px;
    z-index: 1;
}
.mouth2 {
    background-color: #C4CD14;
    position: absolute;
    left: 50px;
    top: 30px;
    width: 300px;
    height: 300px;
    border-radius: 150px;
    z-index: 2;
}

Comments

[Ankhena]

Для оптимизации лучше заменить .mouth2 на ::after