How do I set the global text color
See original GitHub issueI have a dark theme that is currently rendering all the text in all the components as black on a black background. The only one that is white is the menu which has been set through an override
I have tried several different things as you can see below. I am not sure but the docs reference a palette.text but that does not seem to work.
How do I set the global font color
import { createMuiTheme } from "material-ui/styles";
const dark = createMuiTheme({
shadows: ["none"],
type: 'dark',
typography: {
color: 'white',
},
palette: {
background: {
paper: '#000',
default: '#000',
},
text: {
default: '#fff',
},
textColor: '#fff',
primary: {
main: '#ff0000',
},
},
root: {
textDecoration: 'none',
},
overrides: {
MuiPaper: {
root: {
boxShadow: 'none',
},
},
MuiBackdrop: {
root: {
backgroundColor: 'rgba(255, 0, 0, 0.75)',
},
},
MuiAppBar: {
root: {
background: 'white',
boxShadow: 'none',
},
colorPrimary: {
backgroundColor: 'transparent'
}
},
MuiIconButton: {
root: {
marginLeft: -12,
marginRight: 20,
color: 'white',
}
}
}
});
export default dark;
- [ x] I have searched the issues of this repository and believe that this is not a duplicate.
Context
https://codesandbox.io/s/kk6zp8jw07
Your Environment
Tech | Version |
---|---|
Material-UI | 1.00beta.40 |
React | 16.3.0 |
browser | chrome |
etc |
Issue Analytics
- State:
- Created 5 years ago
- Reactions:2
- Comments:6 (2 by maintainers)
Top Results From Across the Web
How to change text color globally? - CSS-Tricks
The 'global' text color is in your bootstrap.css file. body { margin: 0; font-family: Arial, Helvetica, sans-serif; font-size: 12px; ...
Read more >Change the default text color (font color) in Word
Go to Format > Font > Font. + D to open the Font dialog box. Select the arrow next to Font color, and...
Read more >How to change default text color for entire site - Stack Overflow
In this, if you specify a rule like: body { color:red } , and then #id { color:blue } then the color will...
Read more >How to Change Text and Background Color in CSS
To change the background color of the inline text, go to the <head> section. Simply add the appropriate CSS selector and define the...
Read more >How to Change the HTML Font Color - Kinsta
Before HTML5 was introduced and set as the coding standard, you could change the font color using font tags. More specifically, you'd use...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
))) Spend a couple of hours trying to figure it out… SO:
color=“textPrimary” color=“textSecondary”
Thank you, Sleazer!
It’s all documented here : https://material-ui-next.com/style/color/