Proposals 1: simplified style.
unown sans archive
Desktop View
Desktop HD
Created with Sketch.
.O {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;
}
.O:before {
position: absolute;
content: '';
top: 75px;
left: -77px;
height: 75px;
width: 150px;
border-right:5px solid black;
}
.O .eye{
position: absolute;
top:47px;
left:45px;
z-index: 1;
}
.H {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;
}
.H:before {
position: absolute;
content: '';
height: 75px;
width: 150px;
border-bottom:5px solid black;
}
.H:after{
position: absolute;
content: '';
height: 160px;
width: 10px;
left: 70px;
top: -5px;
background: white;
}
Mobile View
Mobile Portrait
Created with Sketch.
.O {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;
}
.O:before {
position: absolute;
content: '';
top: 75px;
left: -77px;
height: 75px;
width: 150px;
border-right:5px solid black;
}
.O .eye{
position: absolute;
top:47px;
left:45px;
z-index: 1;
}
.H {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;
}
.H:before {
position: absolute;
content: '';
height: 75px;
width: 150px;
border-bottom:5px solid black;
}
.H:after{
position: absolute;
content: '';
height: 160px;
width: 10px;
left: 70px;
top: -5px;
background: white;
}
Proposals 2: Pokemon logo style.
unown sans archive
Desktop View
Desktop HD
Created with Sketch.
.H {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;}
.H:before {
position: absolute;
content: '';
height: 75px;
width: 150px;
border-bottom:5px solid black;}
.H:after{
position: absolute;
content: '';
height: 160px;
width: 10px;
left: 70px;
top: -5px;
background: white;}
Mobile View
Mobile Portrait
Created with Sketch.
.H {
position: relative;
height: 150px;
width: 150px;
border:5px solid black;
border-radius: 50%;}
.H:before {
position: absolute;
content: '';
height: 75px;
width: 150px;
border-bottom:5px solid black;}
.H:after{
position: absolute;
content: '';
height: 160px;
width: 10px;
left: 70px;
top: -5px;
background: white;}