# heading

Headline from `<h1>` to `<h6>`

****

- Source: <https://github.com/getkirby/kirby/tree/5.5.3/config/blocks/heading/>

****

## Preview

![](https://assets.getkirby.com/media/pages/docs/reference/panel/blocks/heading/211f85ba3a-1717846665/heading-block.png?width=1416&height=400&enlarge=0)

## Default files

### Snippet

By default, Kirby uses the following snippet to render the heading block:

```php
<?php /** @var \Kirby\Cms\Block $block */ ?>
<<?= $level = $block->level()->or('h2') ?>><?= $block->text() ?></<?= $level ?>>

```

To overwrite [this default snippet](https://github.com/getkirby/kirby/tree/5.5.3/config/blocks/heading/heading.php), place your custom file in `/site/snippets/blocks/heading.php`.

### Blueprint

By default, Kirby uses the following blueprint for the heading block:

```yaml
name: field.blocks.heading.name
icon: title
wysiwyg: true
preview: heading
fields:
  level:
    label: field.blocks.heading.level
    type: toggles
    empty: false
    default: "h2"
    labels: false
    options:
      - value: h1
        icon: h1
        text: H1
      - value: h2
        icon: h2
        text: H2
      - value: h3
        icon: h3
        text: H3
      - value: h4
        icon: h4
        text: H4
      - value: h5
        icon: h5
        text: H5
      - value: h6
        icon: h6
        text: H6
  text:
    label: field.blocks.heading.text
    type: writer
    inline: true
    placeholder: field.blocks.heading.placeholder

```

To overwrite [this default blueprint](https://github.com/getkirby/kirby/tree/5.5.3/config/blocks/heading/heading.yml), place your custom file in `/site/blueprints/blocks/heading.yml`.

### Vue component

[`kirby/src/components/Forms/Blocks/Types/Heading.vue`](https://github.com/getkirby/kirby/blob/main/panel/src/components/Forms/Blocks/Types/Heading.vue)