Jump to the navigation menu

Building a design system in a few hours with Symfony

I recently spoke with Mark Conroy, Director of Development at Annertech, on the Beyond Blocks podcast. We discussed building something useful in a day and building design systems with web components.

Inspired by that conversation, I spent this afternoon experimenting with web components and seeing how I could use them within a design system we're building, as I think they can solve a particular need we have.

Following that, I thought I'd see how I could build my own design system and decided to do it with Symfony and see what I could achieve within a few hours.

It was a great opportunity to take Symfony 7 for a spin and explore and test some things that Ryan Weaver and I discussed in our episode, such as Symfony UX and Twig components.

Each component is a Twig component with its own PHP class and Twig template, which is rendered when I visit its URL, and I can use the HTML-like <twig:Logo /> syntax to include child components.

You can view the code on GitHub, and it may be something I use and work on in the future.

- Oliver

Was this interesting?

Sign up here and get more like this delivered straight to your inbox every day.

About me

Picture of Oliver

I'm an Acquia-certified Drupal Triple Expert with 17 years of experience, an open-source software maintainer and Drupal core contributor, public speaker, live streamer, and host of the Beyond Blocks podcast.