How to style children components?

[grimmwerks]

I'm attempting to use ChromePicker in an app that will be utilized on an iPad. The saturation circle and the circle thumbs for the hue and opacity sliders are too small; I've figured out how to make the hue and opacity sliders height larger, but not the circles.

Could someone point out how I can style the circle pickers please?

`
const styles = {
'default': {

saturation: {
  borderRadius: '10px 10px 0 0',
},
Saturation: {
  radius: '10px 10px 0 0',
},
color: {
  width: '24px',
},
hue: {
  height: '20px',
},
Hue: {
  radius: '20px',
},
alpha: {
  height: '20px',
},
Alpha: {
  radius: '20px',
},

},
}

`

  <div className="w-full space-y-4">
  <ChromePicker
    color={value}
    className="rounded-lg"
    styles={styles}
  />