score:0

Accepted answer
function Child({ message, className }) {
  return <Typography className={className}>{message}</Typography>;
}

function Parent() {
  return (
    <Box
      sx={{
        '.childClass': {
          color: 'primary.main'
        }
      }}
    >
      <Child message="Child with no css class defined" />

      <Child className="childClass" message="Child with css class defined" />
    </Box>
  );
}

score:1

<div className={name of your class that you imported}>

Related Query

More Query from same tag