Theming
The Select component is a multipart component. Read more about how to style multipart components in the style system docs.
This component has two parts: field
and icon
. You can find
more information in the source for the styles
here.
Example
The following theme would change the color of the field
to red.500
, and change the fontSize of icon
to 2xl
.
import { extendTheme } from "@chakra-ui/react";
const theme = extendTheme({
components: {
Select: {
baseStyle: {
field: {
color: "red.500",
},
icon: {
fontSize: "2xl",
},
},
},
},
});