# Mint Theme
**URL:** https://meta.discourse.org/t/mint-theme/202822
**Category:** Theme
**Tags:** official, mint-theme
**Created:** [September 7, 2021, 12:06pm UTC](https://meta.discourse.org/t/mint-theme/202822 "2021-09-07T12:06:24Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [September 7, 2021, 12:06pm UTC](https://meta.discourse.org/t/mint-theme/202822/1 "2021-09-07T12:06:24Z")
| | | |
| --- | --- | --- |
| :discourse2: | **Summary** | **Mint** - A modern theme with a hint of mint. 🙂 |
| 👓 | **Preview** | [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/mint-theme) |
| 🛠 | **Repository Link** | [https://github.com/discourse/discourse-mint-theme](https://github.com/discourse/discourse-mint-theme) |
| 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |
Install this theme
> [@](#):
>
> :discourse2: As this is an #official theme maintained by the Discourse team, #Support issues, #Contribute > Bug reports, #Contribute > UX suggestions, and requests for #Development advice can be made in the respective categories here on Meta, and tagged with the appropriate theme tag. Click on a link below to get one started. 👍
>
> [❓ **Support**](https://meta.discourse.org/new-topic?category_id=6&tags=mint-theme "Ask for support on configuring and using the Mint Theme") [🐛 **Bug**](https://meta.discourse.org/new-topic?category_id=1&tags=mint-theme "A bug report means something is broken, preventing normal/typical use of the theme") [👀 **UX**](https://meta.discourse.org/new-topic?category_id=9&tags=mint-theme "Discussion about the user interface of the Mint Theme, and how features are presented (including language and UI elements)") [🧑🎨 **Dev**](https://meta.discourse.org/new-topic?category_id=7&tags=mint-theme "Advice on how to customise this theme for your site")
### Features
A modern theme with a hint of mint. 🙂
🌿 🧊
**Homepage (categories)**
**Latest**
**Topic**
**Advanced Search**
This theme includes the following component:
- [Discourse Showcased Categories](https://meta.discourse.org/t/showcased-categories-theme-component/173524)
### Tips
### Discourse Settings
Following setting changes are required for this theme to render properly:
- `top menu` needs to be set to **category, latest, new, unread, top**
- `desktop category page style` needs to be set to **Boxes with Subcategories**
### Welcome Banner
Go to **Admin \> Welcome banner** (`/admin/config/welcome-banner`) page.
- in **Enabled on themes…** dropdown select `Mint Theme`
- in **Page visibility** dropdown select `Homepage only`
- in **Location** dropdown select `Below site header`
- **Background image** can be set as per your requirement
### Discourse Showcased Categories
In the options for the `Showcased Categories` theme component, following changes are required for this theme to render properly:
- select the `feed one category` and `feed two category` as per your requirement
- fill in the `feed one title` and `feed two title` as per your requirement
- recommended value for `max list length` is `3`.
> :discourse2: **Hosted by us?** Themes are available to use on our Standard, Business, and Enterprise plans.
> Last edited by @yuriy 2025-12-03T14:01:14Z
>
> > **Check document**
> >
> > Perform check on document:
---
### Author:  [@IAmGav](https://meta.discourse.org/u/IAmGav)
#### Post date: [September 7, 2021, 12:30pm UTC](https://meta.discourse.org/t/mint-theme/202822/2 "2021-09-07T12:30:53Z")
really nice theme 🙂
I might even test it out with royal blue (my favourite colour) on my test site.
Thank you 😃
---
### Author:  [@P2W](https://meta.discourse.org/u/P2W)
#### Post date: [September 10, 2021, 4:27pm UTC](https://meta.discourse.org/t/mint-theme/202822/3 "2021-09-10T16:27:13Z")
@meghna churning out the amazing themes. Looks great. I will deploy and play.
---
### Author:  [@Rebecca\_Chen](https://meta.discourse.org/u/Rebecca_Chen)
#### Post date: [September 13, 2021, 6:31pm UTC](https://meta.discourse.org/t/mint-theme/202822/4 "2021-09-13T18:31:49Z")
Beautiful theme! Thank you for creating this 🙂
I was wondering if it was a way for me to remove the square and circle in the background? Appreciate anything that can point me in the right direction 🙏
---
### Author:  [@tjot](https://meta.discourse.org/u/tjot)
#### Post date: [September 14, 2021, 11:14am UTC](https://meta.discourse.org/t/mint-theme/202822/5 "2021-09-14T11:14:46Z")
remove
```plaintext
#main-outlet:after {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 500px;
height: 500px;
border-radius: 2000px;
background: $color-blue;
right: 1px;
top: -57px;
}
#main-outlet:before {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 300px;
height: 300px;
border-radius: 30px;
background: -webkit-linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
// background: linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
background: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
left: 70px;
top: 350px;
transform: rotate(74deg);
transform-origin: 0 100%;
}
```
from `desktop.scss` and you should be good to go 🙂
---
### Author:  [@Rebecca\_Chen](https://meta.discourse.org/u/Rebecca_Chen)
#### Post date: [September 14, 2021, 5:15pm UTC](https://meta.discourse.org/t/mint-theme/202822/6 "2021-09-14T17:15:44Z")
Thank you so much Tomasz, appreciate it 😃
---
### Author:  [@adalo\_jesse](https://meta.discourse.org/u/adalo_jesse)
#### Post date: [October 15, 2021, 7:23pm UTC](https://meta.discourse.org/t/mint-theme/202822/7 "2021-10-15T19:23:08Z")
This theme is awesome. Thank you for making this! I’m new to the Discourse scene. I know how to upload this theme, but I’m not sure how to change certain things. What I want to change are the colors of the blocks in the back (the circle and square). Additionally, I would like to change the background color. Do I download the theme file and edit it there, then create my own theme? Or is there an easier way?
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [October 18, 2021, 9:27am UTC](https://meta.discourse.org/t/mint-theme/202822/8 "2021-10-18T09:27:28Z")
> [@adalo\_jesse](#):
>
> This theme is awesome. Thank you for making this!
Thanks! 🙂
> [@adalo\_jesse](#):
>
> Do I download the theme file and edit it there
Yes. To change the colors you need to fork the theme and update the color code as per your requirement. Here’s how you can do it:
In [`variables.scss`](https://github.com/discourse/discourse-mint-theme/blob/main/scss/variables.scss) change the color code as per your liking:
```plaintext
$color-blue: #e5f8ff;
$color-square-gradient: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
$color-square-webkit-gradient: -webkit-linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
```
> [@adalo\_jesse](#):
>
> I would like to change the background color
To change the background color update the `secondary` color in [`about.json`](https://github.com/discourse/discourse-mint-theme/blob/main/about.json) (note that this will also change text color of some buttons):
```plaintext
"secondary": "F6FBFC"
```
---
### Author:  [@Nick\_Chomey](https://meta.discourse.org/u/Nick_Chomey)
#### Post date: [November 4, 2021, 6:42pm UTC](https://meta.discourse.org/t/mint-theme/202822/9 "2021-11-04T18:42:56Z")
I love this theme - it fits our project’s branding perfectly! However, if I turn on dark mode, the theme is messed up. Is this to be expected? Is there a way to prevent users from turning on dark mode?
---
### Author:  [@Nick\_Chomey](https://meta.discourse.org/u/Nick_Chomey)
#### Post date: [November 8, 2021, 8:30pm UTC](https://meta.discourse.org/t/mint-theme/202822/10 "2021-11-08T20:30:53Z")
It would also be great to be able to edit the CSS from the front-end, like with the default themes.
---
### Author:  [@cvx](https://meta.discourse.org/u/cvx)
#### Post date: [December 4, 2021, 12:54pm UTC](https://meta.discourse.org/t/mint-theme/202822/12 "2021-12-04T12:54:24Z")
There are two small issues with the composer. 🙂 The gear button has an always-on background, and the first button’s on-hover shape doesn’t match the curvature of the frame:
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [December 6, 2021, 11:31am UTC](https://meta.discourse.org/t/mint-theme/202822/14 "2021-12-06T11:31:36Z")
Fixed both the issues via:
[https://github.com/discourse/discourse-mint-theme/commit/56157bbae8aeb0c809b2ec5f172597b18d423894](https://github.com/discourse/discourse-mint-theme/commit/56157bbae8aeb0c809b2ec5f172597b18d423894)
---
### Author:  [@Pika](https://meta.discourse.org/u/Pika)
#### Post date: [December 7, 2021, 8:02am UTC](https://meta.discourse.org/t/mint-theme/202822/15 "2021-12-07T08:02:10Z")
I really like your theme and installed it.
My search banner background is not with rounded corners and full width.
How can I change this to your layout ?
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [December 7, 2021, 3:27pm UTC](https://meta.discourse.org/t/mint-theme/202822/16 "2021-12-07T15:27:00Z")
There might be a possibility that another theme or component is interfering with the mint theme styling. Can you try disabling other themes/components that you may have installed?
---
### Author:  [@Pika](https://meta.discourse.org/u/Pika)
#### Post date: [December 7, 2021, 3:32pm UTC](https://meta.discourse.org/t/mint-theme/202822/17 "2021-12-07T15:32:15Z")
it’s a clean install with inactieve Default theme and only these componets:
- discourse-search-banner
- Showcased Categories
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [December 7, 2021, 4:27pm UTC](https://meta.discourse.org/t/mint-theme/202822/18 "2021-12-07T16:27:41Z")
That is odd. Can you PM me the URL of your Discourse instance and I can have a look?
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [December 9, 2021, 5:01pm UTC](https://meta.discourse.org/t/mint-theme/202822/19 "2021-12-09T17:01:27Z")
> [@Pika](#):
>
> My search banner background is not with rounded corners and full width.
Banner issue is now fixed via:
[https://github.com/discourse/discourse-mint-theme/commit/5e76e1ed3c248a6492e7fe77996ac98362a83a68](https://github.com/discourse/discourse-mint-theme/commit/5e76e1ed3c248a6492e7fe77996ac98362a83a68)
There was also an issue in showcased categories plugin that Patrick brought into my notice. Fixed that too.
[https://github.com/discourse/discourse-showcased-categories/commit/ad42b5c615dab017a7d0d99927445929587f6d39](https://github.com/discourse/discourse-showcased-categories/commit/ad42b5c615dab017a7d0d99927445929587f6d39)
---
### Author:  [@Ivan\_Rapekas](https://meta.discourse.org/u/Ivan_Rapekas)
#### Post date: [December 15, 2021, 8:58pm UTC](https://meta.discourse.org/t/mint-theme/202822/20 "2021-12-15T20:58:50Z")
Hi, I played with dark mode on device with nice Mint theme. I made some changes to support dark mode. Just for tests.
[discourse-mint.zip](https://meta.discourse.org/uploads/short-url/o1nG6ZWgKg9eZL2UIaENBop1KNi.zip) (5.1 KB) It may contain mistakes of course 🙂 For this reason I won’t create a PR from [github](https://github.com/rapekas/discourse-mint-theme).
I made some modifications for blocks of code, gitlab-style formatting, wide page etc… Mobile device did not test.
---
### Author:  [@meghna](https://meta.discourse.org/u/meghna)
#### Post date: [December 17, 2021, 3:28pm UTC](https://meta.discourse.org/t/mint-theme/202822/21 "2021-12-17T15:28:50Z")
Thank you for the efforts here Ivan! I reviewed your work and there are some custom changes that does not need to be in the core. I’ll look into the dark mode specific changes and will make them in core after some more testing.
---
### Author:  [@Ivan\_Rapekas](https://meta.discourse.org/u/Ivan_Rapekas)
#### Post date: [December 17, 2021, 3:37pm UTC](https://meta.discourse.org/t/mint-theme/202822/22 "2021-12-17T15:37:54Z")
You are welcome, Meghna! I think, it would enough to apply `revert` value to some elements with white.
[Next page](https://meta.discourse.org/t/mint-theme/202822.md?page=2)