# Modernizing the Foundation theme

**URL:** https://meta.discourse.org/t/modernizing-the-foundation-theme/395331
**Category:** Announcements
**Created:** [February 6, 2026, 5:52pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331 "2026-02-06T17:52:14Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [February 6, 2026, 5:52pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/1 "2026-02-06T17:52:14Z")

</div>

The design team are in the process of making small but powerful changes/tweaks to the foundation theme to align a bit closer to modern web standards. To view these changes live on meta, join this group:

[https://meta.discourse.org/g/modernized-foundation](https://meta.discourse.org/g/modernized-foundation)

 ![CleanShot 2026-02-05 at 16.42.34@2x](https://global.discourse-cdn.com/meta/original/4X/e/2/f/e2f5e596a85acbea02b90b671acf6869f82145be.jpeg)

 ![CleanShot 2026-02-05 at 16.43.58@2x](https://global.discourse-cdn.com/meta/original/4X/5/6/f/56f9aeac5f7cbee6c6133cd69dd01eca2df80d2e.jpeg)

 ![CleanShot 2026-02-05 at 16.44.40@2x](https://global.discourse-cdn.com/meta/original/4X/8/6/6/8668f0f30f3195f549bc0e120a4236237764bfd9.jpeg)

We will be making this change live through the new [Upcoming](https://meta.discourse.org/t/introducing-upcoming-changes-a-system-to-manage-new-features-and-changes-to-existing-functionality-in-your-community/392894)Changes feature available in Discourse. This will allow site owners to enable the changes for any group they specify, in order to test the roll out of the changes without the fear of possibly breaking themes or current customizations.

# What will change?

## Header shrinks in height

 ![CleanShot 2026-02-05 at 16.19.32@2x](https://global.discourse-cdn.com/meta/original/4X/1/c/9/1c91dd801de887858fd5d3136ddccdbc371b25ce.png)

We have decreased the site of the header along with some of the icons & avatar slightly to utilize onscreen real estate.

## Default buttons

 ![CleanShot 2026-02-05 at 16.23.37@2x](https://global.discourse-cdn.com/meta/original/4X/a/e/a/aeae6fec97af0897a628878fb0f405fa27fd247f.png)

We are moving from a grey default button background to a transparent / “secondary” background with a border.

- removal of grey background
- addition of borders
- icon color matches text color
- buttons now have a set height

## Create new topic button on topic list page

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/9/e/d9e287f1634f461b20d7045c8898fe8a135282cb.png)

Matching Horizon and giving this a “CTA” background color of `tertiary`

## Lots of gray background removal

 ![image](https://global.discourse-cdn.com/meta/original/4X/5/7/3/573ba0076fb62971c7980adeb617ff018b703511.png)

 ![CleanShot 2026-02-05 at 16.26.46@2x](https://global.discourse-cdn.com/meta/original/4X/6/8/7/687e016f734b670ce142c6e8fad2a9059f3f84cb.jpeg)

 ![CleanShot 2026-02-05 at 16.28.04@2x](https://global.discourse-cdn.com/meta/original/4X/8/5/c/85cd5dd4cad4af1ca86db1af120b90be8378dd45.png)

## Topic list

 ![CleanShot 2026-02-05 at 16.29.53@2x](https://global.discourse-cdn.com/meta/original/4X/a/a/8/aa869b76c4212763f322d6320aaea15a325181e3.jpeg)

- removal of 3 px thicc top border
- decrease font size of table header data
- consistent color for table data items
- color value changes to read/unread
- slight increase in font weight to unread

### Category boxes

 ![CleanShot 2026-02-05 at 16.30.23@2x](https://global.discourse-cdn.com/meta/original/4X/8/d/b/8dba9e7d45cfeb17921d4cfc9fa99919a9145940.png)

- left alignment of text
- removal of thicc left colored border
- slightly rounded badges
- thinner border on box

## Nav bar

 ![CleanShot 2026-02-05 at 16.31.26@2x](https://global.discourse-cdn.com/meta/original/4X/3/0/c/30cf7fc67b7bd521ed01112a17244d782e16d014.png)

- The nav pills on topic list pages will be the same height as buttons in this zone
- darker color text & icon on select kit

## Sidebar

 ![CleanShot 2026-02-05 at 16.31.59@2x](https://global.discourse-cdn.com/meta/original/4X/0/2/e/02ec1d485a938f45f36d78cad837da19ba542579.png)

- icon & text match color
- darker text & icons
- lighter “active” background
- heavier active font weight

## Welcome banner

 ![image](https://global.discourse-cdn.com/meta/original/4X/8/f/f/8ffff4127cccd259fd68229715e8e6aacdeff423.png)

- balanced spacing
- added variables for easier left/right/center alignment via customization
- header font weight decreased
- sub title font size decrease

## Calendar

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/d/5/cd5d75c0ed98b335a5b8126b9609ac22abf5723c.png)

- removed grey background from “buttons”
- use grey only to signify “active”
- switch to “bordered transparent” button styling

## Drop downs

 ![CleanShot 2026-02-05 at 16.34.54@2x](https://global.discourse-cdn.com/meta/original/4X/4/3/0/4305ec7c801f9dc2d20d6d7d0d0b6116cb121238.png)

 ![CleanShot 2026-02-05 at 16.35.09@2x](https://global.discourse-cdn.com/meta/original/4X/2/e/8/2e86b4ac9b7e9ab0ea91af21c9b228f704e46416.png)

 ![CleanShot 2026-02-05 at 16.34.32@2x](https://global.discourse-cdn.com/meta/original/4X/6/e/1/6e140b198f4d17633d58d1ed090a9da4cb06a45c.png)

- padding added to drop down container
- height, padding, gap now matches sidebar items
  - unification of “clickable lists”

- border inherits `--d-border-radius` variable

# New Variables

Some of the changes here will be introduced via additional variables added into core.

## Welcome banner alignment

The alignment of the welcome banner will now be able to be changed via:

```plaintext
// default
  --welcome-banner-text-align: center;
  --welcome-banner-search-menu-margin-inline: auto;

// custom
  --welcome-banner-text-align: left;
  --welcome-banner-search-menu-margin-inline: 0 auto;

```

## Button height

We will now have a set button height via:

```plaintext
// default
  --button-height: var(--space-8);

```

### Font smoothing

We are already doing this in Horizon, it makes sense to bring to foundation.

```plaintext
// new default
--webkit-font-smoothing: antialiased;

```

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [February 6, 2026, 5:52pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/2 "2026-02-06T17:52:35Z")

</div>



---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [February 6, 2026, 7:17pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/3 "2026-02-06T19:17:43Z")

</div>

the gist button dropdown has a scrollbar (`overflow` on the `fk-d-menu` maybe?), and probably doesn’t need the same `min-width: 200px` as other such `dropdown-menu` classes.

 ![image](https://global.discourse-cdn.com/meta/original/4X/3/a/9/3a964be6ee91f9fcd306dec92d86f437586dc41e.png)

edit: nevermind, fixed already 😃

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [February 6, 2026, 10:46pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/4 "2026-02-06T22:46:11Z")

</div>

> [@jordan.vidrine](#):
>
> ### Categories

I can see the modern foundation theme, but why do I still have the old categories layout?

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/8/2/b82e0d0fa624f6b58eaa48b9d08dd41fc3005894.png)

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [February 6, 2026, 10:50pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/5 "2026-02-06T22:50:01Z")

</div>

I think Meta doesn’t use “Boxes with subcategories” but “Categories only” in their `Desktop category page style` site setting.

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [February 6, 2026, 10:52pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/6 "2026-02-06T22:52:15Z")

</div>

Oops, I assumed the screenshots were taken on meta but I didn’t even think of checking it.

* * *

~~Small but weird behavior. On the regular theme, when we release the mouse button on , it instantly triggers the show or close sidebar’s animation.~~

~~On the new theme, when we release the mouse button on when the sidebar is closed, there’s a split second of waiting before the sliding animation is triggered. Doesn’t happen if we click the icon when the sidebar is visible.~~

I’m probably hallucinating 🤔

* * *

Can I leave the group to compare changes with the old theme? I don’t see the leave option.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 6, 2026, 10:55pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/7 "2026-02-06T22:55:42Z")

</div>

> [@Canapin](#):
>
> Can I leave the group to compare changes with the old theme? I don’t see the leave option.

oh yes, fixed that… should be able to leave at will now

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [February 6, 2026, 10:55pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/8 "2026-02-06T22:55:58Z")

</div>

~~Would you please allow me to leave the [@modernized-foundation](https://meta.discourse.org/groups/modernized-foundation) group.~~  
Edit: Now, after leaving the group, I can add a comparison screenshot of the new topic button.  
 ![image](https://global.discourse-cdn.com/meta/original/4X/e/7/6/e76a4a6ef6a8a18dcb6f7ede986b4eb2d244e86a.png)

It seems some icon colors don’t work well with the wcag palette.  
 ![image](https://global.discourse-cdn.com/meta/original/4X/8/e/b/8eb2d0b87de9391c14c7a1681793545f4b59e9ba.png)

And, for example, the group selector on the top left of the group page doesn’t really support 2 lines.

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/5/0/650edbfc07363c62e92613d01c9dee8a95b70b7e.png)

This is how it looks when I log out.

 ![image](https://global.discourse-cdn.com/meta/original/4X/4/a/a/4aa05852d1333421031e930d5270516e4bd032a1.png)

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [February 6, 2026, 11:14pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/9 "2026-02-06T23:14:54Z")

</div>

I like most of the changes. They are subtle. Some I don’t even see the difference unless I look at the CSS values 😄 (sidebar icon and text colors, topic list read and unread colors)

Before / After  
 ![image](https://global.discourse-cdn.com/meta/original/4X/e/2/9/e292160b000bc5e4b9060099187a72f9d433cb18.png) ![image](https://global.discourse-cdn.com/meta/original/4X/6/5/0/6500ad43ccdd2bcc28822912470c0e76b81ec79d.png)

I like the emphasized new topic button. I actually customized it like that on my forum a long time ago (until my code broke and I didn’t bother fixing it).

* * *

Before / After

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/8/d/c8d3e2a801a8862fb2bf10d2ceab6d780b9e0c49.png)  
 ![image](https://global.discourse-cdn.com/meta/original/4X/d/4/d/d4d0455eaa9a19456e39098b8fe039ccb1c7b837.png)

I also like this; At least on dark palette, the dark blue on dark grey was a weird pairing.

* * *

Before / After

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/7/8/d7892bea05d62a936d71608618472f8f18a21b7f.png) ![image](https://global.discourse-cdn.com/meta/original/4X/f/a/9/fa9771c7acf2a8afa8c3e491ca5b1a42c531bfc5.png)

While I like the new button style, I feel they lack contrast with the background in certain areas, especially the topic footer.  
It looks messy. The buttons don’t look like they belong to a specific section, unlike the previous version. They just kind of… sit there. I don’t know if it makes sense.

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [February 6, 2026, 11:25pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/10 "2026-02-06T23:25:07Z")

</div>

> [@jordan.vidrine](#):
>
> decrease font size of table header data

This seems to work on the read and topics activity in some screen sizes

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/e/b/eeb6b95b17582568a70f8a535cafd55f181a7608.png)

But once I reduce the width a little, “Replies” and “activity” seem too big (This is also a problem on /latest)

 ![image](https://global.discourse-cdn.com/meta/original/4X/a/7/e/a7ee9b26f4f0c6e8fca97d89c4f08b5fb25b49a9.png)

There is a similar problem with “updated” and “activity” on `/my/activity/bookmarks`

 ![image](https://global.discourse-cdn.com/meta/original/4X/7/9/5/7957fb9178d8f4a60f7bb793fb3e65caefbb1a11.png)

> [@jordan.vidrine](#):
>
> icon color matches text color

Another example where the icon and text color do not match is the expand button on my profile

This is how it looks when I leave the group:

> [@jordan.vidrine](#):
>
> Topic list

I think you didn’t mention that not only the font size of the table headers, but also the size of the numbers in the Replies, Views, and Activity columns, seem to be decreased.

> [@jordan.vidrine](#):
>
> header

I think the icon in the language dropdown is now very large in relation to the text.  
Before:  
 ![image](https://global.discourse-cdn.com/meta/original/4X/d/f/9/df9b8a31185bf9a93c29cb208fbd6056a9871733.png)

After:  
 ![image](https://global.discourse-cdn.com/meta/original/4X/7/f/b/7fb11897947ff93c4c54ee2fc4681f9c1a9f46b6.png)

---

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [February 7, 2026, 1:12am UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/11 "2026-02-07T01:12:23Z")

</div>

Thank you so much for the before/after. I thought it was missing from the OP.

> [@Canapin](#):
>
> Before / After  
> ![image](https://global.discourse-cdn.com/meta/original/4X/e/2/9/e292160b000bc5e4b9060099187a72f9d433cb18.png) ![image](https://global.discourse-cdn.com/meta/original/4X/6/5/0/6500ad43ccdd2bcc28822912470c0e76b81ec79d.png)

> [@Moin](#):
>
> Before:  
> ![image](https://global.discourse-cdn.com/meta/original/4X/d/f/9/df9b8a31185bf9a93c29cb208fbd6056a9871733.png)
> 
> After:  
> ![image](https://global.discourse-cdn.com/meta/original/4X/7/f/b/7fb11897947ff93c4c54ee2fc4681f9c1a9f46b6.png)

Both these changes look weird: the _after_ side looks much less contrasted and may cause A11y issues, or?

I’m heading to the new group for a test drive!

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [February 7, 2026, 5:25pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/12 "2026-02-07T17:25:52Z")

</div>

The word “link” in the topic map is only partly shown after I join the group:

 ![now](https://global.discourse-cdn.com/meta/original/4X/0/4/c/04cd25362e6666a38693d4ad242f1386103e09a3.png)  
 ![before](https://global.discourse-cdn.com/meta/original/4X/9/f/5/9f51ee3dc356a977fa3608b78b75d7c734d7c9b2.png)

Screenshot taken at [Add link to sidebar category setting to new admin menu in categories section of the sidebar](https://meta.discourse.org/t/add-link-to-sidebar-category-setting-to-new-admin-menu-in-categories-section-of-the-sidebar/393322)

And the text in this modal is difficult to read on hover. I think the contrast was better before

 ![now](https://global.discourse-cdn.com/meta/original/4X/c/7/a/c7ae223d38e1d0c2e027928fc37af336b3b59371.png)  
 ![before](https://global.discourse-cdn.com/meta/original/4X/5/e/a/5ead424178db0b6586a591f60116026551c40f27.png)

---

<div class="post-metadata">

### Author: ![sniper756](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sniper756/32/545002_2.png) [@sniper756](https://meta.discourse.org/u/sniper756)
#### Post date: [February 8, 2026, 6:18am UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/13 "2026-02-08T06:18:42Z")

</div>

I’m really looking forward to the changes to the default style, when will it be released approximately?

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [February 9, 2026, 12:02pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/14 "2026-02-09T12:02:09Z")

</div>

Search input and submit are squished!

![squish!](https://emoji.discourse-cdn.com/twitter/melting_face.png?v=15)

 ![Screenshot_20260209_125824_Chrome](https://global.discourse-cdn.com/meta/original/4X/9/9/0/990b028ebab539c56331e262081c6d47fe7b7097.jpeg)

edit : on mobile only

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [February 9, 2026, 3:35pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/15 "2026-02-09T15:35:11Z")

</div>

All great feedback / bug finding so far. Thanks for the updates.

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [February 9, 2026, 5:14pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/16 "2026-02-09T17:14:40Z")

</div>

> [@Canapin](#):
>
> While I like the new button style, I feel they lack contrast with the background in certain areas, especially the topic footer.

This is a good callout. I think the new button style is quite nice as well, but for some reason in this section (with so many of them together), it doesn’t feel quite right.

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [February 9, 2026, 11:28pm UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/17 "2026-02-09T23:28:06Z")

</div>

![Screenshot_20260210_002050_Chrome](https://global.discourse-cdn.com/meta/original/4X/a/3/2/a32a8ab85f2511040bb7f99f2c82d7b9eab49af2.jpeg)

The unread font weight is heavier than on read topics.  
It didn’t strike me on desktop, but I see it on mobile.

It looks a bit blunt to me.

I liked that discourse mostly opted for just a color change, which felt more elegant than the canonical weight difference we see on many forum software.

Now we have both. The difference is subtle, yet I’d prefer only a color change 🖌

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [February 10, 2026, 10:56am UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/18 "2026-02-10T10:56:01Z")

</div>

Latest round of changes should be live soon from the PR here:

[https://github.com/discourse/discourse/pull/37653](https://github.com/discourse/discourse/pull/37653)

---

<div class="post-metadata">

### Author: ![sniper756](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sniper756/32/545002_2.png) [@sniper756](https://meta.discourse.org/u/sniper756)
#### Post date: [February 11, 2026, 3:25am UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/19 "2026-02-11T03:25:03Z")

</div>

When is the final version expected to be released? I am really looking forward to this style upgrade.

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [February 11, 2026, 7:21am UTC](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/20 "2026-02-11T07:21:21Z")

</div>

> [@Modernizing the Foundation theme](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/13):
>
> 很期待这次对默认风格的修改，大概什么时间发布？

> [@Modernizing the Foundation theme](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331/19):
>
> 请问最终版大概什么时间发布？我很期待这个风格升级

You seem really excited. While the changes are currently still in an experimental state, you can enable `Modernize Foundation theme` today: [Upcoming Changes](https://meta.discourse.org/t/upcoming-changes/395390)

[Next page](https://meta.discourse.org/t/modernizing-the-foundation-theme/395331.md?page=2)
