Paper-Button always as upper case

小开

As was mentioned in the comments above, the material design spec for buttons specifies that the text should be uppercase, but you can easily override its CSS property:

paper-button {
text-transform: none;
}

小开

I had the same issue and I solved the problem via adjusting the default theme. Add the following code to a file (name of your choice).js

import { createMuiTheme } from '@material-ui/core/styles';


const theme = createMuiTheme({
typography: {
button: {
textTransform: 'none'
}
}
});


export default theme;

You can then add the file to your app in index.js. I named it theme.js:

...
import theme from './theme';
...
const app = () => (
<ThemeProvider theme={theme}>
<CssBaseline />
<App />
</ThemeProvider>
);


ReactDOM.render(app, document.getElementById('root'));

小开

Inspired by the the CSS style above here is the inline styling for localized Button text transformation -

import {Button} from '@material-ui/core';


// Begin Component Logic
 

<Button style=\{\{textTransform: 'none'}}>
Hello World
</Button>


// End Component Logic

小开

If you use Mui 5 then you can use the sx syntax

<Button sx=\{\{textTransform: "none"}}/>