There's more...

In addition to formatting header text, you can add other components, such as icons. Let's modify the example to include icons for each panel header. First, you'll import the icons that you need:

import DevicesIcon from 'material-ui/icons/Devices';
import NetworkWifiIcon from 'material-ui/icons/NetworkWifi';
import StorageIcon from '@material-ui/icons/Storage';

Then, you'll add a new icon style that adds space between the icon and text in the panel header:

const styles = theme => ({
  icon: {
    marginRight: theme.spacing(1)
  }
});

Lastly, here's the markup to include the icons that you've imported in the appropriate panel header:

<Fragment>
  <ExpansionPanel>
    <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
      <DevicesIcon className={classes.icon} />
      <Typography variant="subtitle1">Devices</Typography>
    </ExpansionPanelSummary>
    <ExpansionPanelDetails>
      <Typography>Devices content...</Typography>
    </ExpansionPanelDetails>
  </ExpansionPanel>
  <ExpansionPanel>
    <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
      <NetworkWifiIcon className={classes.icon} />
      <Typography variant="subtitle1">Networks</Typography>
    </ExpansionPanelSummary>
    <ExpansionPanelDetails>
      <Typography>Networks content...</Typography>
    </ExpansionPanelDetails>
  </ExpansionPanel>
  <ExpansionPanel>
    <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
      <StorageIcon className={classes.icon} />
      <Typography variant="subtitle1">Storage</Typography>
    </ExpansionPanelSummary>
    <ExpansionPanelDetails>
      <Typography>Storage content...</Typography>
    </ExpansionPanelDetails>
  </ExpansionPanel>
</Fragment>  

The icon comes before the Typography component in the ExpansionPanelSummary component. Here's what the panels look like now:

Here's what they look like when they're expanded:

By combining iconography and typography, you can make the headers of your expansion panels stand out, making your content easier to navigate.