<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
crossorigin="anonymous" referrerpolicy="no-referrer" />
<h1>Fa Brands Fa Google icon | HTML CSS </h1>
<p>Google with Button: <a href="#" class="google-button"> Sign in with <i class="fa-brands fa-google"></i></a>
<p>Default Size: <i class="fa-brands fa-google"></i></p>
<p>Size 2xs: <i class="fa-brands fa-google fa-2xs"></i></p>
<p>Size xs : <i class="fa-brands fa-google fa-xs"></i></p>
<p>Size sm :<i class="fa-brands fa-google fa-sm"></i></p>
<p>Size lg : <i class="fa-brands fa-google fa-lg"></i></p>
<p>Size xl : <i class="fa-brands fa-google fa-xl"></i></p>
<p>Size xl : <i class="fa-brands fa-google fa-2xl"></i></p>
background-color: #396db9;
background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.24);