title: I want to change the color of button in react using material ui
body: <p>using following version</p>
  <pre><code>npm view react version # 17.0.2
  </code></pre>
  <p>My code is as:</p>
  <pre><code>import React from 'react';
  import Paper from '@mui/material/Paper';
  import Grid from '@mui/material/Grid';
  import Image from &quot;material-ui-image&quot;;
  import Typography from '@mui/material/Typography';
  import Rating from '@mui/material/Rating';
  import Box from '@mui/material/Box';
  import Button from '@mui/material/Button';
  import { createTheme } from '@mui/material/styles';
  import { blue, yellow, red } from '@mui/material/colors';
  
  import {Link} from &quot;react-router-dom&quot;;
  
  const theme = createTheme({
      palette: {
          primary: blue,
          secondary: yellow,
      },
  });
  
  const TourCard = () =&gt; {
      return (
          &lt;Grid item xs={3}&gt;
              &lt;Paper elevation={4}&gt;
                  &lt;Image src=&quot;color-separations_3.png&quot;
                         loading=&quot;lazy&quot;
                         className=&quot;img&quot;
                         alt=&quot;&quot;
                         cover
                         disableTransition
                         sx=&quot;2&quot;/&gt;
                  &lt;Grid container spacing={0} mb={2}&gt;
                      &lt;Typography align=&quot;left&quot; variant=&quot;h4&quot; component=&quot;h4&quot; ml={1} mr={2}&gt;
                          TUKAcad
                      &lt;/Typography&gt;
                      &lt;Box mt={2}&gt;
                          &lt;Rating size=&quot;small&quot; value={4} mt={4} precision={0.5}&gt; &lt;/Rating&gt;
                      &lt;/Box&gt;
                  &lt;/Grid&gt;
                  &lt;Typography paragraph={true} variant=&quot;subtitle1&quot; ml={2}&gt;
                      Pattern-making software with advanced functionality to empower accurate pattern building, bespoke
                      grade rules, and marker nesting for every style conceived.
                  &lt;/Typography&gt;
                  &lt;Box ml={2} &gt;
                      &lt;Button variant=&quot;contained&quot;   color={theme.palette.secondary}  target={&quot;_blank&quot;} href=&quot;www.tukaweb.com&quot;&gt;
                          {/*&lt;Link to=&quot;/yourRoute&quot;&gt;Know more&lt;/Link&gt;*/}Know More
                      &lt;/Button&gt;
                  &lt;/Box&gt;
              &lt;/Paper&gt;
          &lt;/Grid&gt;
      );
  }
  
  export default TourCard;
  </code></pre>
  <p>I am new to react, I want to change the colour of the button to yellow any idea how to implement it, thanks in advance .</p>