To skin Bootstrap v4+ heading classes (.h1–.h6). Other typography from that page is unchanged unless we add styles later.
<p class="h1">Heading 1</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
<p class="h2">Heading 2</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
<p class="h3">Heading 3</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
<p class="h4">Heading 4</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
<p class="h5">Heading 5</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
<p class="h6">Heading 6</p>
<p>Proin ac rhoncus diam, sit amet congue nibh. Nullam consectetur pretium erat vitae ornare. Quisque porta a dolor vel maximus. Nullam dictum risus pellentesque orci hendrerit commodo. Nunc et dolor sed turpis accumsan feugiat quis sed mi. Aliquam venenatis scelerisque neque id lobortis. Proin dignissim suscipit pharetra.
</p>
{
"shouldSkipPattern": true,
"bootstrap4Styles": [
{
"isInternal": true,
"layer": "foundation",
"path": "/assets/core-styles.bootstrap4.css"
}
],
"bootstrap5Styles": [
{
"isInternal": true,
"layer": "foundation",
"path": "/assets/core-styles.bootstrap5.css"
}
],
"globalStyles": [
{
"isInternal": true,
"layer": "base",
"path": "/assets/core-styles.demo.css"
},
{
"isInternal": true,
"layer": "base",
"path": "/assets/core-styles.base.css"
}
],
"cmsStyles": [
{
"isInternal": true,
"layer": "base",
"path": "/assets/core-styles.cms.css"
}
],
"docsStyles": [
{
"isInternal": true,
"layer": "base",
"path": "/assets/core-styles.docs.css"
}
],
"portalStyles": [
{
"isInternal": true,
"layer": "base",
"path": "/assets/core-styles.portal.css"
}
],
"subdir": "bootstrap4/content",
"shouldLoadBootstrap": true,
"shouldLoadDocs": true,
"supportStyles": [
"../../assets/settings/font--docs.css",
"../../assets/settings/color--docs.css",
"../../assets/bootstrap4/content/typography-headings/typography-headings--docs.css"
]
}