# Extra Block Styles: Card, Pill Button, Shadow Image and Checklist

> Adds four ready-made style options to the block editor: a card style for Group blocks, a pill style for buttons, a soft shadow for images and a checkmark style for lists.

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

## Code

```php
add_action( 'init', function () {
    register_block_style( 'core/group', array(
        'name'         => 'wpide-card',
        'label'        => 'Card',
        'inline_style' => '.wp-block-group.is-style-wpide-card{padding:1.5em;border-radius:10px;background:#fff;color:#1d2327;box-shadow:0 2px 12px rgba(0,0,0,.08);}',
    ) );

    register_block_style( 'core/button', array(
        'name'         => 'wpide-pill',
        'label'        => 'Pill',
        'inline_style' => '.wp-block-button.is-style-wpide-pill .wp-block-button__link{border-radius:999px;padding-left:1.75em;padding-right:1.75em;}',
    ) );

    register_block_style( 'core/image', array(
        'name'         => 'wpide-shadow',
        'label'        => 'Soft shadow',
        'inline_style' => '.wp-block-image.is-style-wpide-shadow img{border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.18);}',
    ) );

    register_block_style( 'core/list', array(
        'name'         => 'wpide-checklist',
        'label'        => 'Checklist',
        'inline_style' => '.wp-block-list.is-style-wpide-checklist{list-style:none;padding-left:0;}.wp-block-list.is-style-wpide-checklist li::before{content:"\2713";margin-right:.6em;color:#00a32a;font-weight:700;}',
    ) );
} );
```

## Notes

Pick the styles in the block sidebar under Styles. Edit the CSS in each inline_style to match your design.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Extra Block Styles: Card, Pill Button, Shadow Image and Checklist" 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/