WordPress.org

Plugin Directory

Neurogenesis Styler – Advanced CSS Controls for Native Blocks

Neurogenesis Styler – Advanced CSS Controls for Native Blocks

Descripción

Neurogenesis Styler extends the native Gutenberg blocks with advanced design controls-it does not add new blocks.

This keeps your site lightweight, fast, and future-proof while giving you professional styling options inside the block editor.

Design with the blocks you already know-headings, paragraphs, groups, columns, images, and more-now with richer visual tools. No custom blocks, no theme lock-in, no clutter.

Typography
Custom fonts, weights, sizes, line heights, letter spacing, and text shadows-responsive by default.

Backgrounds
Colors, gradients, or images, layered for depth.

Borders & Radius
Width, style, and color per side or globally.

Spacing Controls
Margin and padding for desktop, tablet, and mobile-no CSS.

Visual Effects
Shadows, transitions, opacity, z-index.

Block Sizing
Width, height, min/max, all responsive.

Hover States
Dynamic colors, borders, shadows, backgrounds.

Template Editing
Style templates and template parts for Full Site Editing themes.

With Neurogenesis Styler, Gutenberg feels complete-design modern, responsive sites without adding a single new block.

Roadmap and Future Plans

We are committed to making Neurogenesis Styler the best tool for styling native Gutenberg blocks. Here is what we’re actively working on for upcoming releases:

View generated CSS by section, so you can inspect easy all the properties.

Background Blend Modes: Giving designers even more creative control over layered background images and colors.

Custom Font Provider Integration: Expanding support for popular custom font services.

Source Code

This plugin uses JavaScript and SCSS, which are compiled into the production-ready files in the /assets/dist/ directory.

The original, human-readable source code is included in the /assets/js directory.
The build configuration for this plugin is included in package.json.txt. Rename it to package.json before npm install. Developers can review, modify, or extend the code from there.

Build Instructions

  1. Make sure you have Node.js and npm installed.
  2. From the plugin root, install dependencies:

    npm install

  3. To build the production assets:

    npm run build

  4. For development with automatic rebuilds on file changes:

    npm run start

Capturas

  • Typography controls in the block sidebar – customize fonts, sizes, line height, spacing, and text shadows.
  • Background settings – apply gradients, images, or layered effects directly to any block or group.
  • Border and spacing tools – fine-tune widths, styles, radii, margins, and padding with precision.
  • Responsive controls – style blocks differently for desktop, tablet, and mobile views.

Instalación

  1. Upload the plugin files to the /wp-content/plugins/neurogenesis directory, or install directly through the WordPress plugin screen.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress.
  3. Open the block editor and explore the new styling controls in the sidebar.

Preguntas frecuentes

Does this plugin add new blocks?

No. Neurogenesis Styler extends the native Gutenberg blocks you already use. It does not register new blocks.

Can it override existing block styles?

No, existing block styles cannot be overridden. You need to remove the block styles.

Does this plugin require coding?

No. All design options are accessible directly in the block editor sidebar.

Do I need CSS knowledge?

Zero. Every control is visual: color pickers, sliders, drop-downs.

Will this work with my theme?

Yes, if you’re using a block-based (FSE) theme. Neurogenesis Styler integrates directly with Gutenberg, ensuring compatibility with most block themes. However, some CSS rules defined by your theme may override certain styles.

Can I style templates and template parts?

Yes. The same controls work inside full site editing templates and template parts.

Reseñas

29 de octubre de 2025
I like how this plugin extends the block styling controls; it is simple to use, works very well and i am excited for more options. I am already using it on a client website.This is a great tool in my Gutenberg toolkit 🙂
29 de septiembre de 2025
Great plugin to enhance the basic options limited by Gutenberg. As long as it doesn’t cause any conflicts and remains lightweight, I’m happy to have it installed on my sites that use Gutenberg.
Leer todas las 3 reseñas

Colaboradores y desarrolladores

«Neurogenesis Styler – Advanced CSS Controls for Native Blocks» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

Registro de cambios

0.4.0

January 06, 2026
– Added the possibility to define new element selectors
– Added theme.json variables to the spacing, border and color controls.
– Improved color control UI
– Small bug fixes.

0.3.0

December 04, 2025
– Grouped the style sections into tabs.
– Small bug fixes.

0.2.0

November 06, 2025
– Polished the color picker and added a «Recent Colors» section for faster styling.
– Fixed minor bugs and improved overall editor performance.

0.1.1

October 27, 2025
– Improved style rendering in the editor for more accurate visual previews.
– Fixed issues with duplicated and pasted blocks not retaining custom styles.

0.1.0

September 27, 2025
– Initial release
– Adds advanced design controls to native Gutenberg blocks:
– Typography
– Backgrounds
– Borders
– Spacing
– Shadows
– Responsive settings
– Hover states