Heading

Titles of each major section of a page in the interface.

Headings are used as the titles of each major section of a page in the interface.

Usage

Use for the title of each top-level page section. The default element of heading are h3

Basic Usage

Any title should here

preview

<template>
  <p-heading>
    Any title should here
  </p-heading>
</template>

Setting The Element

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

preview

<template>
  <p-heading element="h1">
    Heading 1
  </p-heading>
  <p-heading element="h2">
    Heading 2
  </p-heading>
  <p-heading element="h3">
    Heading 3
  </p-heading>
  <p-heading element="h4">
    Heading 4
  </p-heading>
  <p-heading element="h5">
    Heading 5
  </p-heading>
  <p-heading element="h6">
    Heading 6
  </p-heading>
</template>

Weight

Heading have 3 weights variant, there are normal, medium and bold. Default weight is normal.

Normal heading title

Medium heading title

Bold heading title

preview

<template>
  <p-heading weight="normal">
    Normal heading title
  </p-heading>
  <p-heading weight="medium">
    Medium heading title
  </p-heading>
  <p-heading weight="bold">
    Bold heading title
  </p-heading>
</template>

Transform

Heading have 4 transforms variant, there are normalcase, lowercase, capitalize and uppercase. Default transform is normalcase.

Normalcase heading title

Lowercase heading title

Capitalize heading title

Uppercase heading title

preview

<template>
  <p-heading transform="normalcase">
    Normalcase heading title
  </p-heading>
  <p-heading transform="lowercase">
    Lowercase heading title
  </p-heading>
  <p-heading transform="capitalize">
    Capitalize heading title
  </p-heading>
  <p-heading transform="uppercase">
    Uppercase heading title
  </p-heading>
</template>

API

Props

Props	Type	Default	Description
element	String	h3	Heading element, valid value is h1 to h6
weight	String	normal	Weight of subheading, valid value is normal, medium and bold
transform	String	normalcase	Transform of subheading, valid value is normalcase, lowercase, capitalize and uppercase

Slots

Name	Description
default	Content to place in heading

Events

Name	Arguments	Description
There no event here

See Also

• Subheading