Easily use Mr.Utils front-end toolkit with the block editor interface without knowing code, the classes or the functions.

You can transform parent blocks (such as Columns or Groups) into components such as Tabs, Swiper or Sliders (with pagination).

You can select what to do when mouse hovering a block (e.g. animations or a semi-opacity).

You can also apply changes to specific devices/breakpoints: Show/hide blocks depending of the device, remove default margins/paddings, apply a global margin/padding, change font-size depending of device and more.


  • Mr.Utils options are found inside the "Utilities" section (closed by default), to not obstruct or confuse with the editor's default options.
  • All options are divided into categories.
  • All options opened (except for breakpoints).
  • Example of options that will apply when mouse hovering a block.
  • Example of options that will only apply on phone devices.
  • Using Mr.Dev.'s Framework allows to select which options will be available (reducing HTTP requests and file size).
  • Mr.Dev.'s Framework allows to create custom utilities to select on the block editor.


  1. Upload the plugin files to the /wp-content/plugins/mrutils directory, or install the plugin through the WordPress plugins screen directly.


Does the interface of Mr.Utils support all blocks?

The interface of Mr.Utils works on the vast majority of core blocks. But you have alternative ways to use them that work on any block:
1. Do you actually need to apply the style directly on the element? Some styles (such as font-size) when applied on parent blocks, might also apply the style into child blocks. With that in mind, you can wrap/transform the unsupported block with a “Group” and then use the interface of Mr.Utils on that group.
2. All options use utility classes, so for unsupported blocks you can also go to “Advanced > Additional CSS class(es)” and form the classes there.
3. Or wait for them to be supported. Maybe you can help me on that.

Where can I find more information about Mr.Utils?

You can find detailed information on the documentation at:
You can also find some tips & tricks on the blog:
General information can be found on:

How do I contact the developer?

You can contact me at:


There are no reviews for this plugin.

Contributors & Developers

“MR.Utils” is open source software. The following people have contributed to this plugin.


Translate “MR.Utils” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.



  • Added spacing options to remove or add Gaps.
  • Small changes to the icons indicating use of components/pagination.
  • Toolkit: Possibility to change red, green, blue and alpha values as an alternative way to set background and text colors.
  • Toolkit: Different scroll behaviour when using scroll navigation (arrows).
  • Toolkit: Change the utility classes from Other to Appearance.
  • Toolkit: If no colors are set for offcanvas background/text/toogle fallback to default background and text colors.


  • Fix preview not working inside block templates and full site editor.
  • Fix indication of variable value when using breakpoints (when defined).
  • Fix size/font-size on breakpoints not working without a global size/font-size.
  • Change the way assets are enqueued following new block functions.
  • Toolkit: Added -webkit-animation on offcanvas for better compatibility.
  • Toolkit: Added optional properties to the “mrActiveInView” javascript function.
  • Fix contact link on plugin description.


  • Added some appearance options to the interface (Background Color and Color).
  • Fixed bug when using custom font-sizes.


  • Added “Swipe”, “Swipe content” and “Scroll Navigation” to the components section.
  • Auto columns option (Layout section).
  • Option for global value on columns and on items per line.
  • “Active when clicked” option on the “Dynamic” section (adds the class “mr-active”).
  • Slide animation now works for paragraphs and headings (not only for child elements).
  • Added font-family options (also compatible with custom utility classes added by Mr.Dev.’s Framework).
  • Improvements to horizontalscroll for better compatibility with blocks.
  • Toolkit: Improvements to offcanvas.
  • Toolkit: Added offset and offsetelement classes and variables.
  • Toolkit: Starting to add classes for appearance and height.


  • Compatibility with Custom Utility Classes added by Mr.Dev.’s Framework.
  • Change animation orientation (for the options Slide, Scale and Zoom) when using pagination arrows.
  • Fixed: Bug when changing back to any default option on breakpoints.
  • Fixed: Semi-opacity not visible on the backend when combined with Components and Pagination.
  • Toolkit: Improved offcanvas options to not rely on javascript.
  • Toolkit: Fixed missing overlay class when not using offcanvas.
  • Toolkit: Fixed SlideOut animation orientation.


  • First release