In the following example, “Lorem” is in a TextSpan
with the default (inherited) text styling,
and “ipsum” is in a separate TextSpan with custom styling.

Lorem <em>ipsum</em>
  </div>
</div>

.grey-box {
    background-color: #e0e0e0; /* grey 300 */
    width: 320px;
    height: 240px;

font: 900 24px Roboto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.red-box {
    background-color: #ef5350; /* red 400 */
    padding: 16px;
    color: #ffffff;
}

.red-box em {
    font: 300 48px Roboto;
    font-style: italic;
}