月亮

<span class="open-icon-moon"></span>

<style>
.open-icon-moon{
    display: inline-block;
    position: relative;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--color-font-1);
    transition: all .5s;
}
.open-icon-moon::before{
    content: '';
    position: absolute;
    top: 0;
    left: 5px;
    width: 10px;
    height: 16px;
    border-radius: 50%;
    background: var(--color-bg-1);
}
.open-icon-moon:hover{
    background: var(--app-color-2);
}
</style>