const buttonColor = {
  color: 'green'
}
const buttonTheme = {
  extend: buttonColor
  background: 'red'
}
const styles = {
  button: {
    extend: buttonTheme,
    fontSize: '20px'
  }
}

const styles = {
  buttonColor: {
    background: 'red'
  },
  button: {
    extend: 'buttonColor',
    fontSize: '20px'
  }
}

const styles = {
  button: {
    extend: [{background: 'red'}, {color: 'green'}],
    fontSize: '20px'
  }
}

const background = {background: 'red'}
const color = {color: 'green'}

const styles = {
  button: {
    extend: [background, color],
    fontSize: '20px'
  }
}

const styles = {
  button: {
    extend: (data) => ({
      color: data.theme.color
    }),
    fontSize: '20px'
  }
}