# Section Styles: Dark and Soft Accent Sections

> Adds "Dark section" and "Soft accent section" styles to Group, Columns and Cover blocks, which recolor the background, text, links, headings and buttons inside in one click (WordPress 6.6+).

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

## Code

```php
add_action( 'init', function () {
    if ( version_compare( get_bloginfo( 'version' ), '6.6', '<' ) ) {
        return;
    }

    $blocks = array( 'core/group', 'core/columns', 'core/cover' );

    register_block_style( $blocks, array(
        'name'       => 'wpide-dark-section',
        'label'      => 'Dark section',
        'style_data' => array(
            'color'    => array( 'background' => '#111827', 'text' => '#f3f4f6' ),
            'spacing'  => array( 'padding' => array( 'top' => '3rem', 'bottom' => '3rem', 'left' => '1.5rem', 'right' => '1.5rem' ) ),
            'elements' => array(
                'heading' => array( 'color' => array( 'text' => '#ffffff' ) ),
                'link'    => array( 'color' => array( 'text' => '#93c5fd' ) ),
                'button'  => array( 'color' => array( 'background' => '#f9fafb', 'text' => '#111827' ) ),
            ),
        ),
    ) );

    register_block_style( $blocks, array(
        'name'       => 'wpide-accent-section',
        'label'      => 'Soft accent section',
        'style_data' => array(
            'color'    => array( 'background' => '#eef2ff', 'text' => '#1e1b4b' ),
            'spacing'  => array( 'padding' => array( 'top' => '3rem', 'bottom' => '3rem', 'left' => '1.5rem', 'right' => '1.5rem' ) ),
            'elements' => array(
                'link'   => array( 'color' => array( 'text' => '#4338ca' ) ),
                'button' => array( 'color' => array( 'background' => '#4338ca', 'text' => '#ffffff' ) ),
            ),
        ),
    ) );
} );
```

## Notes

Edit the colors in the style_data arrays to match your brand. Older WordPress versions are skipped.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Section Styles: Dark and Soft Accent Sections" 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/
