A fully distributed team making the web a better place.

A fully distributed team making the web a better place.

Introducing Twenty Twenty-Four

A behind-the-scenes look at Twenty Twenty-Four, the most expressive and capable WordPress default theme yet, alongside WordPress 6.4.

Each year WordPress unveils a fresh default theme that embodies the year’s advancements and raises the bar for WordPress experience. This year is no exception, introducing Twenty Twenty-Four, the most expressive and capable WordPress theme yet. 

Building an elevated out-of-the-box WordPress experience

At first glance, it’s quite evident that Twenty Twenty-Four is a default theme experience unlike any others before it. With a strong focus on pattern-centric design and implementation, Twenty Twenty-Four makes crafting a beautiful website, blog, portfolio, or any kind of site a pleasant experience right out of the box.  

Our goal was always to design a default theme suitable for any type of site, which is quite an ambitious task, I might add. We kicked off the project exploring what a profound WordPress experience looks like across all sorts of websites, asking ourselves how we get there. 

Twenty Twenty-Four required teams to think outside the box and view theming in a completely different light: as a collection of components and characteristics which, when combined and rearranged, create beautiful variations. 

In this behind-the-scenes look, I chat with Designer, Beatriz Fialho, and Code Wrangler, Maggie Cabrera. Both Beatriz and Maggie are Automattic-sponsored WordPress contributors who played leading roles in bringing this beautiful theme to fruition.

By the time Twenty Twenty-Four was released, over 60 people contributed code, and more than 120 others contributed in some form or fashion.

Maggie Cabrera

Beatriz, where did the inspiration for the design come from?

After a few conversations with the default theme leads, and impressions gathered from the WordPress community, it seemed that there was an opportunity to build a theme that served many purposes: blogging, creating a business website, showcasing work with a portfolio or even creating a one-page website for an event. Consequently, I was inspired by common patterns from business and commercial services websites, but felt compelled to explore those with an elegant serif font that perhaps is more often used in other contexts.

Likely influenced by a visual trend, I observed that the detail of the rounded edges of the theme’s images, as opposed to pointed edges, matched the subtlety of the typography, enhancing the character of its simple design.

And tell us about your design process?

The design process started in Figma where we gathered some visual references, explored ideas for patterns, templates and styles, and tested different types of content until we reached a cohesive foundation. I then created a rough base in the WordPress editor itself using the Create Block Theme, which I exported as a zip file that would be the starting point for the development.

As development work continued on GitHub, we kept adjusting design elements that needed to be adjusted, we mapped font and spacing variables to WordPress presets and tinkered with style variations.

Maggie, what does it look like to work with hundreds of contributors on an open source project like Twenty Twenty-Four?

Collaborating with the community was my favorite part of the process. The theme’s design was announced at the start of WordCamp US, which meant those who were interested could help kick off the theme during Contributor Day. It was exciting to introduce Twenty Twenty-Four to the community in person, and be able to start working on it right away.

By the time Twenty Twenty-Four was released, over 60 people contributed code, and more than 120 others contributed in some form or fashion (reviews, design, discussion, and the like). During the development cycle, we had dozens of pull requests to review daily, and everything moved generally pretty quickly. As the release cycle comes to a close, it’s nice to sit back and reflect on the crucial decisions made throughout the project. Two examples of this come to mind: the discussion about template selection and implementing style variations for those templates, and the discussion about how the home template works. Overall, I’m thrilled with the outcome. 

Download WordPress 6.4 and Twenty Twenty-Four

WordPress 6.4 “Shirley” takes the site-building experience to a new level, introducing a range of upgrades that unlock many unique features of the Twenty Twenty-Four theme. A few of these key enhancements include improved pattern management, support for background image in group block, image lightboxes, vertical text orientation, and a handful of improvements to writing flow. 
In all, Twenty Twenty-Four marks a profound leap forward for WordPress experience, setting the standard for all themes.

Explore Twenty Twenty-Four further and download it today.


Related

Join Automattic Design

We’re looking for great designers to work on products within the WordPress ecosystem and beyond. Join our team of diverse, global perspectives building a better, more open web.