How can I add heading in a box component in Material UI?

Two boxes currently look like this. I would like Nifty on top of the number like a heading. I'm relatively new to Material UI. I'd appreciate any help regarding how I can give heading to my boxes.

The code for the 2 boxes:

<Grid item sm={6}> 
<Box component="span" sx={{ p: 2, border: 3,borderColor: 'error.main' }}>
Nifty
<Grid component="span" sx={{ p: 2}}> {row.data.price}</Grid>
</Box>
</Grid>



<Grid item sm={6}> 
<Box component="span" sx={{ p: 2, border: 3,borderColor: 'error.main' }}>
Sensex
<Grid component="span" sx={{ p: 2}}> {row.data.price}</Grid>
</Box>
</Grid>

Thanks.

Would this be what you are looking for?

 <Grid item sm={6}>
  <Box
    component="div"
    sx={{
      display: "inline-block",
      p: 2,
      border: 3,
      borderColor: "error.main",
      textAlign: "center"
    }}
  >
    <Box component="h2">Nifty</Box>

    <Box component="div" sx={{ p: 2, textAlign: "center" }}>
      {row.data.price}
    </Box>
  </Box>
</Grid>