JSFiddle - React, Tailwind, and code Playground

HTML

<div class="border">
     <h1 class="header big">E-Chef: All your recipes in one place. Online.</h1>
</div>

CSS

.header {
    font-family: Times New Roman;
    color: #5F9EA0;
    text-align: center;
    background-color: #FF7F50;
    border: 30px dotted #FAEBD7;
    margin: 0 0 0 0;
}
.big {
    font-size: 36px;
}
.border {
    border: 5px solid black;
}

JavaScript

$(document).ready(function () {
    $('h1').animate({
        fontSize: '+=36'
    }, 2000, 'linear');
});