At Team ‘25, we announced a new brand and design direction with one goal: to unleash the potential of every team through clear, modern, and consistent design.

Since then, Atlassian websites and apps have been making moves towards this refreshed new style.

Learn what’s changing in our design system and how to use the new styles.

Atlassian’s foundational styles and components are getting a refresh to improve usability and showcase our new brand.

Note that some features are still early access (ready to preview and test, but not for widespread use).

We’re rolling out more readable fonts with more distinct heading levels to aid scanning.

Updated text components and tokens are ready to use in code and our Figma libraries.

Icons have a new, more streamlined style. In the new system, icon sizes and shapes are more consistent and fit better with the refreshed text styles.

New icons are available in code and Atlassian Figma libraries.

New colors are being trialed in some apps to showcase our refreshed brand identity.

We’ll update this page and the general color guidance when the new colors are ready for broad use.

We’re testing some component changes to go with the new styles.

You can preview some of these early access updates in our component examples.

In component examples, choose Styles then select the new design language to see refreshed styles applied.

Select the Custom option to choose individual styles. This is helpful if you want to see how the component looks with specific styles turned on (controlled by feature flags).

For example, if you’re migrating to the new icons, you can customize the examples to just show new icons.

Some apps are already testing the refreshed styles with customers. Check out guidance on using the latest styles and components:

Get more details on using refreshed UI in Figma and in code:

We’ll update this page and the developer community with more resources soon.