Jira themes are moving to beta!

[#1]

Note: We’ve updated this article to reflect the progress of themes in Jira 19/04/2023

Hello Community

We’re moving into beta! That means you’ll no longer need to opt-in through Jira labs to change the appearance of your Jira Cloud Products.

Our biggest milestone moving into beta is that marketplace apps have begun transitioning to being compatible with dark theme! We’ve worked out most of the bugs that were identified during the early access phase, thanks to the community. We know there could be a few more things to fix up, so we’re still eager to hear more feedback while the project is in the beta phase.

Change the appearance of Jira!

Choose between a dark theme or a light theme.

Dark

If you’re a bit of a night owl or you’re in dark mode on your other work tools and you want consistency, then Jira can join you on the dark side. Some other awesome dark theme benefits include:

• reducing eye fatigue

• improved accessibility for people who are sensitive to light

• lower energy consumption of some devices

• it looks really cool

Light

If you like it bright, try out light theme. While it’s similar to Jira’s original theme, you might notice some subtle changes as we’ve updated the contrast across our colors to help with accessibility and usability.

Jira’s original theme isn’t getting the boot just yet so if you like things the way they are, there’s no need to change to the new themes for now.

How to use themes

There are a few ways to change the theme on your Jira Cloud products. You can still control your theme from your Personal Settings page just like before. But for beta, we’ve added a new and extra fast theme-switching method via the Account icon on the top navigation bar.

If you’d like to chose a theme via the Account icon on the top navigation bar:

1. Select your Account icon in the top navigation bar.

2. Select Theme.

3. Select the theme you’d like to use.

If you’d like to chose a theme via your Personal settings page:

1. Go to Settings > Personal Jira settings.

2. Scroll down the page to Theme.

3. Select the theme you’d like to use.

Selecting Match system will sync the theme to your device. If you’re using a device that has a dark or light theme, Jira will match that.

If you’re an admin with more than 10 users on your site and you don’t want this feature available in your instance, please contact our support team.

What to expect

The majority of our products are looking pretty sweet in the new themes, but there are a few bits and bobs that are definitely a work in progress. It won’t affect all our users, but depending on your setup, those areas might look a little odd during the beta period.

If you find parts of Jira that don’t look quite right with the new themes, please give us feedback through the feedback link on your Personal settings page.

1. The feedback link on your Personal settings page.

Custom colors in the top navigation bar

If you’re working in your project and notice the top navigation bar is a custom color that isn’t compatible with the new dark theme, your admin may have changed the site colors. You’ll need to contact your admin to revert the colors, then they’ll work with the new themes.

To revert the colors of a Jira site and make it compatible with the new themes, an admin will need to:

1. Go to Settings > System.

2. Under USER INTERFACE, select Look and feel.

3. Find the section titled Navigation colors.

4. Select Revert to reset the custom colors.

Here are a few things we’re still working on

All these things will continue to work normally, they just might look odd while we make them compatible with the new themes. If you’re experiencing any of these bugs and you feel like they are too distracting or disruptive, you can change back to the original theme.

1. The Editor experience
   The Editor experience affects all of our products, specifically when viewing and creating issues and Pro-Forma for Jira Service Management. The areas that we are working on are:

   • Viewing and editing panels

   • Editing Tables
     
     

2. Marketplace apps

We’ve enabled the theming of Marketplace apps built with Connect and Forge across all Jira Cloud customer instances. Marketplace partners are busy getting their apps ready to support theming, and you’ll see themed apps in your instance once that work is done and released by partners. 

Thanks to a few of our early adopter partners who collaborated with us during the pilot and early access programs to test and share feedback, and worked hard to have apps now ready to support theming!

JXL for Jira:

We adopted the new design tokens and implemented themes in JXL for Jira together with a big enhancement of the conditional formatting feature in our issue tables. It now has a 90-shades colour spectrum that instantly adjusts to the theme. As always, we poured a lot of design love and attention to detail into it and it turned out just perfect. Check it out yourself.

Appfire:

Appfire maintains its own design system, so part of the process of implementing this feature across our product ecosystem meant ensuring that global dark mode in Atlassian works seamlessly with Appfire’s own implementation of dark mode. We’re thrilled to announce that we’ve rolled out dark mode in Issue Matrix for Jira as part of the pilot program (with JSU not far behind), and we’re looking forward to enabling this feature on more apps, so our customers can fully customize their Atlassian sites.

Tempo:

Exciting news for those using Timesheets by Tempo within Jira! Tempo now supports dark mode when planning or logging time in the issue view. This new enhancement provides a more seamless experience for Tempo and Jira users — in addition to helping reduce eye strain and providing more comfort when working in low-light conditions.

If you're a Marketplace Partner, see our quick start instructions for theming Connect apps. For all the details and latest updates, follow our developer community announcement, where you can ask questions and get help.

3. Embedded Confluence experience
   This bug should be fixed over the next week (we’re so close!). In the meantime, if you're embedding Confluence pages in any Jira products, they might look a bit like a Zebra. The bug primarily affects knowledge based articles in Jira Service Management.
   
   

4. Illustrations and images
   We’re working on getting the many images (over 1000!) across Jira Cloud products to be compatible with dark theme. In the meantime it might look a little odd while we work to identify all the custom images and create darker versions of each one.

Watch this space

Before I sign off, I’d love to give a shout-out to the many teams across Atlassian that helped bring this much-anticipated feature to life. We’re all so excited to see it out in the wild!

We’ll keep you posted on any updates, so like and follow this post to follow the journey.

If you have any immediate thoughts or questions, you can share it in the comment thread below

Thanks for reading,

Amira Badran

Product Manager, Jira Software 

[Guang Yang]

Fantastic new theme! Thanks for the effort Jira team!

[David Meredith]

We've been using 3rd party CSS hacks and styles to have this for ages but I'm really happy that Atlassian have started to push this out natively even while there are some inconsistencies with parts of the system.

The blindingly white screens are difficult to deal with, especially if users have had to log on at night for whatever reason. 

[Yatish Madhav]

Superb! Thanks @Amira Badran , Atlassian and team ... I am about to toggle it on for myself and share this with the team and hopefully later with our organization. Apprecaite the effort and look forward to general availabilty and additional tweaks ... esp with add ons. Thank you

[Tayim, Dina (D.)]

Not sure where the best place is to leave feedback. Love the dark theme but certain things do not show up well. I am playing around with Dashboards right now and two of the widgets I added use colors that are hard to see against the dark background ( Sprint Health Gadget and the Filter Results Gadget when Label was added as a column). 

[David.Horn]

Thank you for the new feature!

[Aniket Kriplani]

The dark theme looks great! Super sleek! Thanks!

[Amanda Barber]

Just shared with my team - I know a few people who will be thrilled by this addition!

[Sean Midkiff]

Are there plans to bring this to Data Center? 🤞🏼

[John Funk]

A very welcomed feature!

[Collista Lewingdon]

So excited for this feature!!! Sharing out to our users in our monthly Atlassian Newsletter. 

[Amira Badran]

Thanks everyone for testing out the new dark theme and providing feedback. Your input helps us improve the user experience and make the product even better. We appreciate your help and support.

For those of you who have reported issues with the top navigation bar being a custom color that isn’t compatible with the new dark theme, your admin may have changed the site colors. You’ll need to contact your admin to revert the colors, then they’ll work with the new themes.

To revert the colors of a Jira site and make it compatible with the new themes, an admin will need to:

1. Go to Settings > System.

2. Under USER INTERFACE, select Look and feel.

3. Under the Navigation colors section, and next Background select Revert

If you still have any comments or suggestions, please don't hesitate to share them with us. Thank you for your participation and for taking the time to provide feedback.

[Bogdan Butnaru _Qotilabs_]

@Amira Badran This sounds like basically any color customization is not compatible with themes at all. I think you should update the Look and feel page to allow administrators to configure separate customizations for dark and light mode, otherwise most of that page becomes useless.

[Amira Badran]

@Bogdan Butnaru _Qotilabs_ Thank you for your feedback regarding the look and feel page. Our team is currently evaluating the usage of this page and how it can better work with the newly introduced colour themes and will plan any necessary improvements accordingly. If you have any further questions or concerns, please do not hesitate to reach out to us.

[Amira Badran]

@Sean Midkiff Thanks for your interest in the dark theme. We appreciate your feedback and understand that this is a top ask across all products and in Data Centre. We are committed to improving the accessibility of our products and have been working on a number of improvements in this area. However, at this time, the Data Centre team does not have a dark theme on the roadmap.
Thank you again for your interest and for taking the time to share your feedback with us.

[Sharon Page]

Super excited to see this is being implemented and tested!

Looks promising so far.

Is there a view to roll this out to the Atlassian Administration pages as well? And when can we expect a similar feature for Confluence? :)

[Tercio Silva]

The panels are kinda weird in dark mode...

 

[Collista Lewingdon]

 

I second Tercio's comment. And drop down menus are so light you cannot even SEE them on a regular screen. And yes, I did submit the feedback through the link as instructed when you opt in to dark mode. 

[Amira Badran]

Hi @Tercio Silva and @Collista Lewingdon, Thank you for taking the time to test out our new Dark Theme. Please be assured that we are aware of this issue and are working diligently to resolve it as soon as possible. In the meantime, if you have any further questions or problems, please do not hesitate to reach out to us.

[Janusch Rentenatus]

 Very nice. But how I can set dark to Confluence? Bad now so patchy. 

[luca palminteri]

finally, although I've made an extension for this (all free). The code is public if someone wants to use it or improve it.

repo: https://github.com/LucaPalminteri/dark-theme-jira

extension: https://chrome.google.com/webstore/detail/dark-theme-for-jira/ckedjfpbcmnjleckmfjogkchahffaomg

I'd love to have some feedback. Enjoy it.

[Zach Norris]

I've been enjoying the light/dark themes. Thank you for the effort that's been put into it. Any chance I could convince someone to implement https://drafts.csswg.org/mediaqueries-5/#prefers-color-scheme so I don't have to choose just one? It's really handy going between devices, or when I have my macbook set to change based on time of day.

Cheers.

[Matthew Ropp]

Yay!  Finally!  :-)

Hopefully Confluence will follow close behind.

[Amira Badran]

@Zach Norris Thanks for sharing your feedback with us, and great to hear you are enjoying the new colour themes! Regarding the automatic theme switching based on time, we are happy to inform you that this is a highly requested feature. It is on our roadmap and being actively considered for development. We will make sure to keep the community updated on the status of this feature. 

Thanks again :) 

[Summer Hogan]

Thanks for the information @Amira Badran ! I'm using the new dark theme and I love it! I have reported a few issues already that I am seeing, but overall it is wonderful; especially to the eyes! 

[Raimon Colmenares]

Yes! That's something we needed! Good to have a rest for the eyes!