CSS
html, body {
background: white;
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.google-logo {
width: 0;
height: 0;
border-top: 200px solid #ea4335;
border-right: 200px solid #4285f4;
border-bottom: 200px solid #34a853;
border-left: 200px solid #fbb605;
border-radius: 50%;
position: relative;
}
.google-logo:before {
content: '';
background: white;
width: 240px;
height: 240px;
position: absolute;
top: -120px;
left: -120px;
border-radius: 50%;
}
.google-logo:after {
content: '';
width: 196px;
height: 80px;
background: #4285f4;
position: absolute;
top: -40px;
}
.google-logo .hole {
width: 0;
height: 0;
border-top: 200px solid transparent;
border-right: 200px solid white;
border-bottom: 0 solid transparent;
border-left: 0 solid transparent;
position: absolute;
left: 40px;
top: -240px;
z-index: 100;
}
