Adding original color icon the React-Icons

Question

Here's my code snippet:

<div className="mt-6 flex gap-2">
    <AuthSocialButton
        icon={BsGithub}
        onClick={() => socialAction('github')}
    />
    <AuthSocialButton
        icon={BsGoogle}
        onClick={() => socialAction('google')}
    />
</div>

React-icons itself only have a blank gray color. Is there any way for React-icons to have the colors of the original logos that it copied from? For example, The react icon google looks like this: https://i.stack.imgur.com/25A0v.png I want it to look like this: https://i.stack.imgur.com/WZd9Y.png

Answer 1

Did you try to add inline style or CSS classes ? something like that?

<AuthSocialButton
icon={<BsGithub style={{ color: '#333' }} />}  // GitHub's color
onClick={() => socialAction('github')}/>