# Heading Block Styles: Eyebrow and Accent Underline

> Adds two style options to the Heading block: a small uppercase "eyebrow" label for section kickers, and a heading with a short accent line underneath.

- Type: PHP
- Runs: Run everywhere
- Category: [Block Editor](https://wpide.com/library/category/gutenberg/)
- Tags: block-styles, headings, typography
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/block-styles-headings/

## Code

```php
add_action( 'init', function () {
    register_block_style( 'core/heading', array(
        'name'         => 'wpide-eyebrow',
        'label'        => 'Eyebrow',
        'inline_style' => '.wp-block-heading.is-style-wpide-eyebrow{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.8;margin-bottom:.5em;}',
    ) );

    register_block_style( 'core/heading', array(
        'name'         => 'wpide-accent-line',
        'label'        => 'Accent line',
        'inline_style' => '.wp-block-heading.is-style-wpide-accent-line::after{content:"";display:block;width:3rem;height:4px;margin-top:.4em;border-radius:2px;background:currentColor;opacity:.6;}.wp-block-heading.is-style-wpide-accent-line.has-text-align-center::after{margin-left:auto;margin-right:auto;}.wp-block-heading.is-style-wpide-accent-line.has-text-align-right::after{margin-left:auto;}',
    ) );
} );
```

## Notes

Pick them in the block sidebar under Styles. The accent color follows currentColor, so it matches the text color you choose.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Heading Block Styles: Eyebrow and Accent Underline" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/