Description

When defining a default gradient background for any element or block that has support for gradient background, the background cannot then be changed to a plain solid color*, as the default gradient always overrides the selected background color.

*A plain background color can be selected but it will have no effect, leaving the user confused as to why their color background choice isn't being applied.

The effect of this is that for those elements or blocks with a default gradient, the user is locked in to gradient backgrounds only. They can never change the background of those elements or blocks to a solid plain color.

There is no lock-in the other way around. A default plain background color can be changed to a gradient background and back again.

Consequences of this issue are a very confusing user experience, and a blocker to releasing themes with a default gradient background on any element or block.

Elements affected by this issue

• Body - reported in Gradient background set in theme.json can not be replaced with solid color #42105
• Button
• Heading

Blocks affected by this issue

• Paragraph
• Heading
• Gallery
• List
• List Item
• Quote
• Archives
• Button - reported in Button: Gradient backgrounds applied in Global Styles cannot be overridden with solid colors at the block level #67055
• Buttons
• Terms List
• Code
• Column
• Columns
• Details
• File
• Group
• Latest Comments
• Latest Posts
• Media & Text
• Page List
• Preformatted
• Pullquote
• RSS
• Search
• Separator
• Social Icons
• Table
• Verse
• Site Title
• Site Tagline
• Title
• Excerpt
• Content
• Author
• Author Name
• Date
• Post Terms
• Post Template
• Pagination
• Next Page
• Page Numbers
• Previous Page
• No Results
• Query Total
• Read More
• Comments
• Comment Author Name
• Comment Content
• Comment Date
• Comment Edit Link
• Comment Reply Link
• Comments Title
• Comments Pagination
• Comments Next Page
• Comments Page Numbers
• Comments Previous Page
• Comments Form
• Login/out
• Query Title
• Author Biography
• Comments Count
• Time to Read
• Table of Contents

Blocks with background color unaffected as they don't currently support gradient background

• Calendar
• Footnotes
• Post Navigation Link
• Term Description
• Comments Link

Related issues

• Setting a default gradient on a block prevents user from changing background to a solid color #47391 (reported as affecting blocks, elements not included)

Step-by-step reproduction instructions

Set a default gradient background on any element or block in theme.json
Go to Site Editor and try to change the background of the element or block to a plain solid color
Edit a page/post, add the block and try to change the background to a plain solid color

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure