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

CleanShot 2026-02-05 at 16.42.34@2x1920×1303 203 KB

CleanShot 2026-02-05 at 16.43.58@2x1920×1312 243 KB

CleanShot 2026-02-05 at 16.44.40@2x1920×1317 218 KB

We will be making this change live through the new Upcoming 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@2x3090×766 195 KB

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@2x1484×254 21.7 KB

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

image262×108 2.16 KB

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

Lots of gray background removal

image1380×578 46.6 KB

CleanShot 2026-02-05 at 16.26.46@2x1920×1835 185 KB

CleanShot 2026-02-05 at 16.28.04@2x2192×666 61.5 KB

Topic list

CleanShot 2026-02-05 at 16.29.53@2x2216×956 198 KB

• 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@2x2208×1036 292 KB

• 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@2x1194×138 10.4 KB

• 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@2x542×968 17.2 KB

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

Welcome banner

image1380×326 32.8 KB

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

Calendar

image1380×290 11.9 KB

• 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@2x834×794 64.8 KB

CleanShot 2026-02-05 at 16.35.09@2x528×968 41 KB

CleanShot 2026-02-05 at 16.34.32@2x508×764 16.8 KB

• 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:

// 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:

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

Font smoothing

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

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

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.

image267×153 8.09 KB

edit: nevermind, fixed already

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

image1438×1168 122 KB

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

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.

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

Would you please allow me to leave the @modernized-foundation group.
Edit: Now, after leaving the group, I can add a comparison screenshot of the new topic button.

It seems some icon colors don’t work well with the wcag palette.

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

image526×116 5.5 KB

This is how it looks when I log out.

image515×135 5.77 KB

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

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

image264×156 4.38 KB

image252×162 3.84 KB

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

Before / After

image847×440 42.8 KB

image849×449 42.3 KB

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.

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

image751×225 17.3 KB

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

image665×227 12.6 KB

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

image774×268 21 KB

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:

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.

I think the icon in the language dropdown is now very large in relation to the text.
Before:

After:

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

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!

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

now746×205 12 KB

before772×215 12.1 KB

Screenshot taken at Add link to sidebar category setting to new admin menu in categories section of the sidebar

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

now500×296 14.1 KB

before490×299 14.2 KB

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

Search input and submit are squished!

Screenshot_20260209_125824_Chrome1080×2340 167 KB

edit : on mobile only

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

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.

Screenshot_20260210_002050_Chrome1080×2340 276 KB

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

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

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

You seem really excited. While the changes are currently still in an experimental state, you can enable Modernize Foundation theme today: Upcoming Changes

I’m using it and it feels great……………………………..

I was using the Foundation theme on my local, without the experimental new features enabled.

Then I realized every once in a while the theme components I had enabled for the theme started to show up as unassigned, randomly.

Has this happened to anyone?

This looks fantastic and so modern!

image562×401 10.3 KB

The translation button seems to be too dark.

Not assigned:

msedge_pcmF2JqoZN1065×123 8.1 KB

Assigned (button border missing):

msedge_uw4nX8jWEV1096×111 10.4 KB

there’s a problem when i try to search for a ip adress:

Capture d'écran 2026-02-11 174145387×125 2.04 KB

4 posts were split to a new topic: Issue with enabling upcoming changes

A post was merged into an existing topic: Horizon Theme

These issues have been addressed.

Would you mind pointing me to the relative url to access this UI? (Yes, I’ve worked at Discourse for 6 years and still don’t know where some things live )

That’s the admin-profile view I believe. Not sure related to the Foundation changes; saw it earlier today on another theme too.

I can see it at /admin/users/id/USERHERE

thanks! It was addressed in this PR → FIX: Change @class to @triggerClass on ip lookup menu by jordanvidrine · Pull Request #37831 · discourse/discourse · GitHub

There is a black dot to the right of the small handle

screenshot_20260214_1304461320×465 48.7 KB

image558×336 11.4 KB

When the button is hovered over, the icon disappears.

The compose icon is off-center:

On an empty search page, there’s a floating border:

image1103×725 29.2 KB

image1092×629 29.6 KB

On mobile, the post count container is too tall, or the translation button is too short, I don’t know which one should be tweaked

Screenshot_20260216_015646_Chrome577×339 16.8 KB

this made me laugh.

Thanks for all of the feedback again everyone, will work on this round and have it updated by EOW.

it’s the same if i try to remove a tc at /admin/config/customize/components

Screenshot_20260218_183014_Brave1080×477 69.5 KB

This is actually an issue with AI search not with these foundation improvements.

What page is this on?

It’s on the /categories page. I have the same

Avatars have a higher z-index than the category list when we edit a topic’s title:

image791×512 49.6 KB

I’m trying to activate the theme but I don’t see how to proceed!

I have activated the Foundation theme in upcoming, but in my themes, there is only the old Foundation theme.

Is this normal?

Yes that’s normal. The upcoming changes affect how the Foundation theme looks like. It’s not a different theme.

Switch the homepage to categories, the upper right corner ~~~~~~~~~~~~~~~~~~~~~~~~

This is not happening for me. Here is what I am seeing locally:

CleanShot 2026-02-26 at 09.44.46@2x1746×896 81.2 KB

Can you confirm this doesnt happen when this update is turned off? I didn’t edit any z-index so am wondering how this would have happened.

It doesn’t happen anymore. No clue why.

Uh~ I just celebrated that this issue was fixed these few days. But after I rebuilt just now, this problem appeared again.

Specifically, only the post-approval will hit this bug:

Left is the original, right is the one without padding-inline set, seems that the No button is shorter than the Edit Post button.

屏幕截图 2026-03-05 130823827×852 51.9 KB

屏幕截图 2026-03-05 130805825×852 51.8 KB

Not sure if it is by-designed, just report it.

IMG_92771206×589 77.1 KB

And in mobile view, there seem to be an unnecessary outline when clicking more button.

image608×334 12.5 KB

Another issue: The tags fail to display here with proper color.

The card at the end of a PM is also misaligned in height.

(The “x” button expand the card’s height)

hello，It seems like this hasn’t been fully fixed yet.

IMG_42021320×2868 284 KB

On mobile, the notification button’s transparent background cause issues:

image596×320 52.4 KB

when is this actually going to be made official? having 2 foundations with different classes is a pain for theme and component dev.

I’m curious as well to know if there’s an estimated release date, and if the release will need .uc-modernize-foundation-theme as a parent selector or if it’s just temporary.

Thanks for the pings everyone. This project is still in the works, amidst a ton of other things we are trying to keep in check. My plan is to merge some of the smaller items into core while keeping things like buttons, header, and anti aliased font behind the feature flag for now.

I have made room for this next week and will begin sharing some more updates then.

What sort of issues have you run into with your theme and component work with this feature turned on or off?

This is just temporary for now as it is scoped to the upcoming changes feature being enabled.

mostly the buttons! lately i have been formatting buttons for new foundation not realizing they look different in old foundation until a certain awesome robot pointed it out recently lol. new foundation looks better too

Thank you for your reply!
I’ve been halting a custom theme for several weeks now because it will be based on the new foundation, and I don’t want to mess my code with temporary stuff, I prefer to wait and work from the final release

How it looks on Foundation and Meta Branded:

The number and arrow containers should be the same size.

I do not see this on mobile. I assume this is desktop?

Thanks, I dug more: It’s because of the new foundation theme, which is also used on Meta Branded, and happens both on desktop and mobile.

I’m not sure if it should be moved to Modernizing the Foundation theme or not.

Made the exec decision to do so

This has been fixed & will be updated soon

On dark theme, the active state on certain buttons (mostly visible with keyboard navigation, only transient when using mouse/touch) is dark purple on dark background and harsh to the eyes:

Red hover state as well:

But the worst is the “danger” button with a red background and dark text:

Perhaps simply tweaking the red value/brightness would fix the 2nd and 3rd points.

Is this only on this meta theme?

Yeah. On foundation:

active

hover

danger

Better contrasts than Meta Branded.

This is still the case:

image395×237 6.82 KB

Are there any plans to adjust the borders of the buttons when using the WCAG color palette? I currently find the thin, very light border difficult to see, so in some places it looks to me like there are just icons floating around rather than buttons. This wasn’t a problem with the previous solid-gray buttons.

I also felt similar when the shadow below the header was removed and when the colored line at the top of the composer was removed. But while those are clear zones of my screen, the buttons are at different places, which makes the fact that they are difficult to tell apart from their surroundings more difficult for me.

Text fields in the settings, for example, have a darker outline:

image555×115 2.69 KB

I also noticed that this seems to break the styling of the category security:

image697×523 14 KB

image687×527 14 KB

The group selection for the upcoming change also looks unusually large in the new design:

image1067×126 5.32 KB

image1083×129 5.3 KB

I think the navbar text size is too small on mobile (less legible than it looks like in the screenshot as it’s at the top of the page). The Suggested/Related font is too small too.

New font sizes too small1080×1859 211 KB

Old font sizes are good:

Old font sizes1080×1852 209 KB

See also

i think this is clearly a matter of taste because i think exactly the opposite of the old vs new. the old foundation fonts and buttons feel too chunky, while the new foundation sleeker elements look much nicer in the overall layout comparitively. i have no complaints about functional usage on desktop or mobile, nor have any of my users since i enabled it.

i think you could give feedback to your admins as well and perhaps they could create another theme with the old changes? enlarging those fonts you indicated isn’t difficult with css. or you could use a stylus type scripting browser extension to add your own mods (i do that with all the discourse sites i visit, including this one).

edit:

for example, something like these:

topic header text

.extra-info-wrapper .topic-link {
    font-size: larger;
}

related/suggest topic footer buttons see also below

.more-topics__container .nav {
    font-size: larger;
}

Theres a small gap under the Related button

Related button577×320 45.5 KB

Suggested button614×319 51.4 KB

Becomes more obvious if the font size is increased

Stylus

.more-topics__container .nav .d-button-label {
   font-size: 150%;
}

Related button enlarged font711×319 50.6 KB

Suggested button enlarged font720×319 54.6 KB

yea that is why i said “something like”, because they may have some other things going on with their theme. i was using meta, not Rust forum. i’ll have a look for you because i am nice. but i have to wait until there is some new and unread items to get the full footer header. i assume from the screenshot with avatar that that is in mobile viewport?

The quirk is visible here

Screenshot1080×319 56 KB

OK this looks like a UX bug with the new foundation theme and the injected AI related topic button. the button classes are a bit different:

Screenshot from 2026-05-02 18-53-50661×106 13.6 KB

but this will fix it a bit - can patch it with some padding and line-height adjustment:

.more-topics__container .nav li .btn {
  padding: .5em;
  line-height: 0;
}

desktop:

mobile:

For the pinned state menu, the options overlap severely:

Screenshot20260514233946Chrome1080×2408 176 KB

Opening the Manage Tag Groups page in a mobile browser displays layout issues - Contributions / User Experience - Discourse Meta