Kirby Bricks UI - New animated gif!

Kirby Bricks

Do you know about Kirby Bricks? It started out like a proof of concept plugin and it has now been completely rewritten.

Without repeating the docs here, I give a screenshot of how this modular approach work:

Kirby Bricks UI

Because I really like how Bricks turned out, I’ve started a preview tool for it. It’s in an early stage because I started with it today, but you can still get an idea of how it will work.

Bricks or Patterns

I bet I will get questions about the differences to the Patterns plugin.

Bricks contains for example snippet controllers, autoload and prefixed types which I don’t think Patterns have. There are probably much more stuff that is different like that Bricks and Bricks UI are separated just like Kirby and the Panel.

The Patterns plugin probably have things Bricks doesn’t have. It’s all about a personal taste and how you want to work I think.

So, what do you think? If you have ideas already I would like to hear them.

Thanks for the word! :slight_smile:


I love it. I saw the Bricks plugin but never tried it out before.
This will probably change my whole workflow when developing a site. I’ll have a better look at it later, but it looks really promising.

Again Awesome job Jens! But Could you give us more detail? Example etc…? How can i use Bricks UI for template or a project?

Bricks UI evolved today. I can’t release it yet, but I will try to get a LIVE DEMO up. :slight_smile: That would be a better way to show it, than just an animated gif.


Hopefully it will. :slight_smile: It changed my workflow completely and I just can’t go back. I haven’t even started using Bricks UI yet.

https://lå is made with Kirby + Bricks (without UI). I’ve been working with that site back and forth for about a year and changing structure all the time. It started with WordPress, then Kirby and finally Kirby + Bricks and now I finally feel satisfied with everything.

I will make a new announcement in the post about Bricks 2.0 when I’ve tested it even more. I think Bricks UI will be released about the same time.


I will probably give you this when I’m closer to release:

  • Live demo
  • Docs
  • Animated gifs
  • Screenshots
  • Example site

I can see now that the animated gif does not say that much.

I want to make a modular (pre-build design blocks) template. That will be great.
Thank you so much Jens!

1 Like

That’s a nice idea to always have some pre-defined bricks around for re-use.

When working on building Bricks UI, I discovered that I needed tabs and it seems like there are no scripts in the world that does exactly what I want.

Therefor I needed to build an own javascript for tabs:

Strange how new things that was not ment to be, just pops up from nowhere when I’m building stuff…

1 Like

Wow Nice tab component! Jens

1 Like

I’ve been working hard with Bricks UI. Here is a brand new preview of the current/finished state of it. Animated gif below the features…


  • Inspect bricks, html, text and image files in the Bricks UI tool.
  • Set background, margin and outline in Bricks UI tool or by a config file for better preview (optional).
  • Set one or more pages which the brick should use to generate itself by (optional).
  • Override controller values with a Bricks UI controller (optional).
  • Set an own wrapper template to present the brick (optional).
  • More options and features.

Click to enlarge

As soon as I have tested this on a fresh installation of the starterkit I will release it if there are no bugs.

Any feedback would greatly be appreciated! :slight_smile:

1 Like