WordPress 7.0 adds a new `customCSS` block support that lets users apply custom CSS directly to individual block instances from the post or site editor. Previously, targeting a single block required a two-step workaround involving custom class names and the global CSS field. The new feature adds a Custom CSS input in the block inspector's Advanced panel, gated by the `edit_css` capability. CSS is stored in the block's `style` attribute under a `css` key, and at render time a unique hash-based class is generated and scoped using `:root :where()` to ensure proper cascade order after Global Styles. The support is enabled by default for all blocks, with an opt-out via `block.json`. Several core blocks like `core/freeform` and `core/html` opt out by default. Plugin and theme developers using server-side rendering should ensure their block's outermost tag is a standard HTML element.
Table of contents
The ProblemWhat ChangedHow It WorksOpt-OutCapability CheckFor Plugin and Theme DevelopersFurther ReadingShare this:2 Comments
Sort: