JSFiddle - React, Tailwind, and code Playground

HTML

<figure id='first'>
    <figcaption>Experiments</figcaption>
</figure>

<figure id='second'>
    <figcaption>Experiments</figcaption>
</figure>

<figure id='third'>
    <figcaption>Experiments</figcaption>
</figure>

CSS

#first figcaption:before
{
   content: 'Figure\nChemistry';
   display: block;  
    white-space: pre-wrap;
}

#second figcaption:before
{
   content: 'Figure\AChemistry';
   display: block;  
    white-space: pre-wrap;
}

#third figcaption:before
{
   content: 'Figure\00000AChemistry';
   display: block;  
    white-space: pre-wrap;
}