Ollie Block Academy

Styling Blocks

How themes use theme.json to style blocks

Theme.json provides the modern styling system for block themes, generating CSS from design tokens set through the site editor’s style interface. These styles are automatically applied to both editor and frontend contexts.

WordPress combines theme.json base styles with per-block customizations, creating inline styles with high specificity. These styles can be challenging to override, so understanding their structure is crucial for block developers.

Theme.json styles appear as inline CSS with precise class names, indicating they come from the styling system. Block developers must account for these styles when creating custom block CSS.

Back to: Ollie Block Academy > Styling Blocks