Since day one the Atlassian Design Guidelines (ADG) has been built using the Atlassian User Interface (AUI) library. With each release, we’ve continued to shorten the gap between design and development but found we still weren’t doing enough to close the loop for developers. Today we’ve teamed up and coordinated a joint release to make it even easier for developers to create great experiences.

Our design and development team has been working for the last 8 weeks on making a seamless experience between design guidelines and developer documentation. The result is a simple mapping of ADG patterns and controls with AUI components.

What’s in the ADG release


Email guidelines for consistent product notifications across our apps.



A downloads section was added to include a PSD GUI of the ADG along with color swatches and layer styles for your Photoshop needs.


Progress indicators

We’ve added a consistent way to display loading feedback to our users. Progress indicators contains spinners, determinate and indeterminate load patterns.


Icon font additions

The icon font now contains 77 icons!


Everything else

There was so much in this release that we could only list some of the highlights here. Full details are available in the changelog.

  • Improved application switcher for jumping between AUI and ADG
  • Upgraded to AUI 5.2 with documentation link updates
  • Tables – added editable tables and compact buttons, and cleaned up of existing content
  • Compact buttons added to buttons guideline
  • Typography – marketing and special typography styles added
  • Colors – purple added to the palette along with derivatives and explanations of usage
  • Application header updated to include split buttons in application headers
  • Mentions got a freshen up with retina examples
  • …and a heap of bug fixes!

Visit the ADG

What’s in the AUI release

Library upgrades

  • jQuery 1.7.1 -> 1.8.3
  • jQuery UI 1.8.11 -> 1.8.24
  • Backbone 0.9.2 -> 1.0.0
  • underscore 1.4.3 -> 1.4.4

Documentation upgrade

To help us with versioning of our documentation we’ve started a migration process in this release. The API documentation has a new home and an updated look and feel thanks to the ADG.


Progress indicators

A great benefit of releasing AUI and ADG together is that new components can be used with design guidelines right from the start.


Full release notes

This was a huge release for AUI and everything can’t be captured here. For all the little details and upgrade guides you can check out the release notes for 5.2.

Visit the new AUI docs


Double feature – AUI 5.2 and Design Guidelin...