CoBlocks has a new logo

CoBlocks has a new logo

A couple of weeks ago, I started pushing out a new, cleaner logo for CoBlocks. We ultimately needed a new logo that accurately portrayed the underlining theme behind our work, and that fit nicely within the context of the new Gutenberg WordPress block editor.

Comparing the fresh new CoBlocks logo with our old look.
Old vs. New CoBlocks logo

The refresh is pretty straightforward, though it speaks to a wider theme of how we’re approaching page building with Gutenberg: modern simplicity. And while our old logo was quite nice, it just didn’t fair well in the editor’s interface. It rendered horribly in small interfaces and the icon stood out considerably, as it was 3D based — while every other icon in the editor is flat.

We want CoBlocks to feel like a familiar part of the block editor at every stage, and so we needed a new icon — thus a new logo. The new logo fits in, rather than stands out. It’s still the letter “C” but built with flat block components, symbolizing how you’d build your next WordPress site with CoBlocks.

I also tweaked our primary color, Cerulean Blue, just a smidgen. It’s a direct evolution from the previous Neon Blue we used, and is much better suited for accessibility. This may seem like a small change, but bits such as this are really important to us.

Comparing the new primary color for CoBlocks with the old.

CoBlocks is a modern toolkit empowering creators to build beautiful websites. Our new logo matches our mission. It’s clean, modern, accessible, and it enhances the WordPress editor experience rather than dominating it.

Let me know what you think!

  1. Understand the change fully – and nice work! I personally preferred the older logo a bit more but that’s besides the point 😅🖖

    1. I did think about it, but in most contexts it’ll be delivered as a solid color (if not black or white), as a gradient would stand out in a negative fashion within the editor.

Leave a Reply

Your email address will not be published. Required fields are marked *

Up Next:

How to Conditionally Load Front-end JavaScript for Gutenberg Blocks

How to Conditionally Load Front-end JavaScript for Gutenberg Blocks