ReCaptcha API v2 Styling

Question

I have not had much success finding how to style Google\'s new recaptcha (v2). The eventual goal is to make it responsive, but I am having difficulty applying styling for ev

Answer 1

You can use some CSS for Google reCAPTCHA v2 styling on your website:

– Change background, color of Google reCAPTCHA v2 widget:

.rc-anchor-light { 
background: #fff!important; 
color: #fff!important; }

or

.rc-anchor-normal{
background: #000 !important; 
color: #000 !important; }

– Resize the Google reCAPTCHA v2 widget by using this snippet:

.rc-anchor-light { 
transform:scale(0.9); 
-webkit-transform:scale(0.9); }

– Responsive your Google reCAPTCHA v2:

@media only screen and (min-width: 768px) {
.rc-anchor-light { 
transform:scale(0.85); 
-webkit-transform:scale(0.85); } 
}

All elements, property of CSS above that’s just for your reference. You can change them by yourself (only using CSS class selector).

Refer on OIW Blog - How To Edit CSS of Google reCAPTCHA (Re-style, Change Position, Resize reCAPTCHA Badge)

You can also find out Google reCAPTCHA v3's styling there.