/ Plugin Category

/ Design & Themes

/ Themes & Templates

/ Blocks CSS: CSS Editor for Gutenberg Blocks

Blocks CSS: CSS Editor for Gutenberg Blocks

By Hardeep Asrani

Design & Themes / Themes & Templates

Blocks CSS: CSS Editor for Gutenberg Blocks Review - In-Depth Analysis

Blocks CSS allows you to add custom CSS to your Blocks directly from the Block Editor (Gutenberg). It features a syntax-highlighted CSS Editor for enhanced styling.

Performance Overview

WPS Score

7.24/10

User Rating

4.9/5 (based on 25+ reviews)

Active Installations

5,000+

Update Frequency

Average It is calculated using the weighted average of same category plugins.

Security Score

1 / 10 (Very Low Risk) It is calculated using the weighted average of all versions.

What It Does

Blocks CSS allows you add custom CSS to your Blocks straight from the Block Editor (Gutenberg).

It adds a syntax-highlighted CSS Editor where you can add additional CSS to your Gutenberg Blocks to style them the way you want.

All the code and sources for this plugin are publicly available as part of GitHub.

Comparing to Alternatives

Blocks CSS is a focused plugin designed to enhance the Gutenberg block editor by allowing custom CSS editing per block. Compared to other block styling plugins, it offers a lightweight and straightforward approach.

Top alternatives

Blocks CSS: CSS Editor for Gutenberg Blocks

Strengths

Integrates seamlessly with Gutenberg blocks for targeted CSS editing.
Lightweight and does not bloat the editor interface.
Highly praised for its simplicity and effectiveness.
Active user support noted by the community.

Weaknesses

Dependency on other plugins like Otter can cause content issues if deactivated.
Occasional UI glitches such as duplicate CSS editors in some setups.
Lacks advanced styling features found in more comprehensive design plugins.
No official pro version limits feature expansion.

User Sentiment Analysis

User feedback highlights the plugin's essential role in enhancing the block editor experience, with many appreciating its simplicity and support.

Positive highlights

"Can't think of Block Editor without this. Tiny powerful thing." - Masud Rana
"Does exactly what I need it to do." - Andreslav
"Essential, Useful Tool, Completes the Block Editor, Should be part of the core." - someguy42
"Очень классные возможности! Пользуюсь постоянно!" (Very cool features! I use it constantly!) - shooter604
"Works like a charm on any of my recent WP projects." - maltmann

Common complaints

Dependency issues causing content breakage if related plugins are deactivated.
Duplicate CSS editor instances appearing in some environments.
Lack of cleanup in code causing multiple initializations under React StrictMode.
Limited features compared to more comprehensive CSS plugins.

Weaknesses

UI inconsistencies with multiple editors shown simultaneously.
Potential conflicts with other plugins or themes causing unpredictable behavior.
No built-in solution for the duplicate editor issue.
No pro version to address advanced user needs.

Who Should Use This?

Best for

Users who want a simple, lightweight plugin to add custom CSS directly to Gutenberg blocks without complex setup.

Not ideal for

Users needing advanced styling options or those who require a fully supported pro version with extended features.

Pricing & Value

Free version includes

The free version offers full functionality for editing CSS on Gutenberg blocks, providing essential styling capabilities without cost.

Final Verdict

Blocks CSS is a valuable tool for users seeking straightforward CSS editing within the Gutenberg block editor. Its simplicity and integration make it a favorite among users who want to enhance block styling without added complexity.

However, occasional UI issues and dependency concerns suggest it may not be suitable for all environments. Users looking for advanced features or guaranteed stability might need to consider alternative solutions.