I'm unsure how to change the color from the default blue to something else. The example code is in the codesandbox link below. I tried changing the styling for root, but had no success.
Version 2.1.0 of react-select
has added the option to override the theme.
Here an example of how it works:
<Select
defaultValue={flavourOptions[0]}
label="Single select"
options={flavourOptions}
theme={(theme) => ({
...theme,
borderRadius: 0,
colors: {
...theme.colors,
text: 'orangered',
primary25: 'hotpink',
primary: 'black',
},
})}
/>
You can find here the complete documentation and live example and here the different variables that can be overwritten.