Copy environment

Heading

<h2 class="heading  ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h2>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  }
}

Link

Secondary

<h2 class="heading heading--secondary ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h2>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--secondary"
}

Tertiary

<h2 class="heading heading--tertiary ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h2>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--tertiary"
}

On Dark

<h2 class="heading heading--on-dark ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h2>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--on-dark"
}

On Primary

<h2 class="heading heading--on-primary ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h2>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--on-primary"
}

H 1

<h1 class="heading heading--h1 ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h1>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--h1",
  "element": "h1"
}

Semantic H 1

<h1 class="heading  h2">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h1>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "element": "h1",
  "class": "h2"
}

Small

<h5 class="heading heading--h5 ">
    <span class="heading__small">it is time to</span>
    <span class="heading__main">
                    contact us
            </span>
</h5>
{
  "language": "en-US",
  "data": {
    "prefix": "it is time to",
    "text": "contact us"
  },
  "modifier": "heading--h5",
  "element": "h5"
}