We’re currently working on updating the Atlassian Design System’s UI foundations, including a new colour and elevation system that utilises design tokens, and we want to share this with you first!
Design tokens and the new colour foundations will simplify the process for designers and engineers to build experiences, make them more easily accessible (including improved contrast), and support theming — the all important enabler for dark mode. Design tokens will be in all Atlassian Design System components, as well as throughout front-end platform components in
@atlaskit, such as the Editor.
Adopting design tokens will make it easier for you as marketplace partners to build apps that provide a consistent and familiar experience inside Atlassian products by using the exact design tokens that we use ourselves, and seamlessly align on the same colour palette!
We recently announced dark mode is coming to Jira Cloud, shipping in general availability in Q2 (Apr-Jun) 2023. This is a close collaboration between the Atlassian Design System + Jira Cloud teams. We’re all here to support you to onboard to design tokens and get ready for dark mode in your apps on the marketplace — whether they’re built on Forge or Connect.
We understand you’ll need to plan and allocate time in your product roadmaps, so wanted to give you a heads-up of what’s coming soon:
This month (Oct 2022), we’ll publish an early preview of our atlassian.design docs to allow time for the community to review and ask questions. This will include info about the new colour system, as well as design tokens. We deliberately want to share this as soon as possible, so keep it mind it will change as we finalise it!
Update: This is now published – jump to details
Progressively over the next quarter (Oct-Dec 2022), we’ll release:
- Details of how to use design tokens in your apps, for initial development and testing, and later through to production — we’ll be keen to hear your feedback!
- New Figma libraries that use the new colour palettes and design tokens
- Tooling to help both designers and engineers migrate existing experiences/apps to use design tokens (such as plugins for Figma, ESLint and Stylelint)
There will be a closed alpha and an open beta prior to general availability, and you’ll have access to both of them. Exact timing and details will be shared later this year.
Watch this post and we’ll let you know when each of the above are available!
Update Dec 2022: All of these are now ready — read the details and get started!
If you have any questions please ask us right here on the forums. My colleagues will also be able to help, so let me introduce:
- Dafne Rodriguez, Product Manager, Atlassian Design System
- Lachie Wallman, Program Manager, Atlassian Design System
- Carlos Khatchikian, Senior Engineering Manager, Jira Cloud — you may have read Carlos’ updates over on the Jira Cloud suggestion for dark mode already!
Thanks everyone for your support. I can’t wait to see you try out the new design tokens, and get dark mode into the hands of our mutual customers!
Atlassian Design System