Change text color in Semantic UI button Component

Question

I'm using Semantic UI to design a button component having animation. How can I change custom font color inside button? Below is my code for the button:

https://codesandbox.io/s/interesting-yonath-7qvwl?file=/index.js

Answer 1

you can use inline styling

<div>
    <Button color="google plus" animated="toggle">
      <Button.Content style={{color: '#f1f2f3'}} visible href="#" secondary>
        <Icon name="google plus" /> hi
      </Button.Content>
      <Button.Content style={{color: '#f1f2f3'}}  hidden href="#">
        Connect <Icon name="google plus" />
      </Button.Content>
    </Button>
</div>