5 April, 2018

New patterns

Updates and bug fixes

  • iOS and Android have been removed from color usage in Colors foundation.

  • Updated the Avatars component to indicate “User avatars” and “Entity avatars”.

  • Updated the Buttons component to use live examples.

  • Removed “newly added” and “removed” badges from the Badges component.

30 January, 2018

The Atlassian Design Guidelines have been split for Cloud and Server products. provides the Cloud guidelines, and provides the Server guidelines.

This site is getting a series of content updates. Not all foundations, components and patterns have been revised yet, but will receive updates over the coming weeks and months.

New patterns

  • The “How we design”, “Onboarding”, and “Native Apps” sections have been removed.

  • The “Layout” and “Grid” foundations have been removed.

  • The “Charts”, “Dynamic tables”, “Keyboard shortcuts”, and “Labels” components have been removed.

  • The “About page”, “Activity stream”, and “Reveal text” patterns have been removed.

Updates and bug fixes

  • The Atlassian brand and marketing guidelines are available from

  • The “Avatars”, “Dropdowns”, “Inline Dialog”, “Modal dialog”, and “Progress indicators” components are under revision.

  • The “Avatar uploader”, “Comments”, “Focused tasks”, “In-product help”, “Mentions”, “Progress tracker”, “Sidebar”, and “System notifications” patterns are under revision.

  • This site has been upgraded to use AUI version 7.6.0.

  • Updated site typograhy to align with server product guidelines.

  • Updated site navigation to use the canonical AUI vertical navigation pattern.

  • Removed the “hybrid” option from the Layout foundation.

  • Updated the Modal Dialog component guidelines on dialog dimensions.

  • Several hyperlinks have been updated to point to the right places. No more 404’s!

31 March, 2016

New patterns

Updates and bug fixes

  • Updated the Avatars component to indicate that all avatars are now shown inside a circle mask.

  • Updated the Tables component reflect the new consistent design we are trying to achieve.

29 March, 2016

Updates and bug fixes

14 March, 2016

New patterns

Updates and bug fixes

  • Typeahead pattern has been removed

21 January, 2016

New patterns

  • Added Date picker pattern, including details on selecting dates through text or with a calendar dropdown.

29 December, 2015

New patterns

Updates and bug fixes

  • Updated the PSD and Sketch templates available on the Resources page.

  • Moved Charts to Components section.

13 December, 2015

Updates and bug fixes

  • Removed the “Login” pattern

14 October, 2015

New patterns

  • Added File viewer pattern, including details on viewing a file in our products.

Updates and bug fixes

22 July, 2015

Updates and bug fixes

11 May, 2015

New patterns

  • Added Sidebar pattern, including details on submenus, tree navigation, and more.

  • Added Toggle button component to the buttons page

  • Added Onboarding as a section, detailing high level principles, with examples.

  • Added Logo lockup guidelines to the brand pages

  • Added Tisa typeface to the brand typography page

Updates and bug fixes

  • Stray dropdown removed from the tables page, other invalid markup cleaned up

  • Fuzzy search is enabled – search now matches based on page content, not just page title

  • Search works on 404 page, main index page, license page and changelog page.

  • Clicking disabled code links no longer open new tabs

  • Clicking the search icon allows searches to be completed on the site

  • Reduced the filesize of the brand images

  • Fixed a bug with the video overlay in Chrome

  • Added a “We’re hiring!” link to the right menu footer section above Feedback

  • Issue collector JavaScript no longer blocks page rendering

  • Colour wheel displays text for colours in safari

  • Updated AUI to 5.8.11

16 March, 2015

Updates and bug fixes

  • Added custom 404 page

  • Updates to stalking vertical navigation

  • Updated Sketch and PSD files on resources

  • Fixed a bug where colors couldn’t be copied to clipboard

  • Color wheel on colors</a> is now an SVG

  • Added downloadable personas on the personas page

  • Updated AUI to 5.8.4

3 November, 2014

Updates and bug fixes

  • Responsive layout bugs have been fixed and is now usable on mobiles and tablets

  • Links provide to API and code examples for system notications and in-product help

  • New structure and rewritten content for iconography, colors, typography, inline dialog, labels, lozenges, tooltips, tabs

  • Cleaned up brand logos

  • Removed Source Code Pro font from Sketch and PSD GUIs

  • Pagination 404s on secondary pages fixed

  • Updated content to be consistent with the published API for flag messages

  • Updated inconsistency with form labels in content

  • Split logo in site header to link to the home page and the section overview

  • Removed in-page navigation clipping and scrolling issues

  • Made titles on the home page clickable and removed CTA buttons

21 August, 2014

New patterns

  • Brand guidelines are completely new and include logos, colors, typography, illustration styles and much more.

  • Completely new design of the ADG itself and is now split up into product design, brand and how we design.

  • Keynote presentation template, company logos, favicons and updated product GUIs available for download

  • Videos have been added to the how we design section for conference talks and general design awareness

Updates and bug fixes

  • Site has been moved to instead of

  • Consolidation of blue colors so we don’t reference bright blue 1, bright blue 2 and blue anymore. The colors are now navy, blue and cyan.

  • Removal of buggy code examples and replaced with screenshot call outs

  • Removal of contextual screenshots from products in favor of better example mockups with call outs

  • Broken links to API docs fixed

  • Redesigned call out mockups to look like the new design

  • Note - this information is outdated and was fixed in a later version. See the 16 Mar, 2015 release notes for details. The former bright blue 1 color, #3b7fc4, was introduced in the last release but did not pass accessibility on #f5f5f5 backgrounds. The blue color is now #3179C2 and passes AA accessibility standards on #f5f5f5 and #fff. View the full product design color palette.

  • Date formats have been moved to patterns

  • Design principles, approach, resources and other getting started design information has been moved out of product design and into it’s own section called how we design.

20 July, 2014

New patterns

  • Buttons style updates removing gradients to have a simpler, flatter UI that fits our design language better

  • Messages style updates and notification flags have been added

  • In-product help added for helping users understand blank states, UI controls and moving forward in our applications

  • Colors updated with new branding palette and consolidation of unnecessary colors (#3b73af is now removed)

  • System notifications for 404 pages, upgrade tasks, system start up and 500 errors

  • Sketch GUI added to the downloads page as a resource

  • Avatar uploader pattern added for adding user and project avatars to our products

  • Navigation menu items have been collapsed into ‘Components’ as a single page to better illustrate how a page is structured

  • Typography now has a larger H1 which flows down through the other sizes

Updates and bug fixes

  • Guideline for when to opening links in new windows

  • PSD GUI and swatches updated with new style changes

  • Carets removed from right side of the application header menus

  • Feature discovery page removed due to duplication with in-product help

  • Writing guideline updated with minor tweaks

  • Modal dialogs and inline dialogs now have a subtle animation by default

  • Home screen icon added for users who want to save a bookmark of the site

2 May, 2014

New patterns

  • Search is no longer the white background with nasty rounded corners

  • Personas have been added to our getting started section

  • Native apps guidelines have been introduced for building OS X, Windows, iOS and Android applications for Atlassian

  • Forms are new and improved with a kickass form validation and contextual help

  • Content pages are now fixed width with a stalking sidebar to change between sections

  • The ADG is now responsive with a collapsible menu for mobile usage

Updates and bug fixes

  • Upgraded to AUI 5.5 with documentation link updates

  • Controls, Dialogs and Communicators all now live in Components

  • New logo

  • New sections added to the home page redesign with introductory copy

  • Page restructure moving the docs and API links to the top right of every page

  • Icon font now has 196 icons

  • Buttons guidelines were rewritten and the page is much easier to follow

  • Various other bug fixes and minor improvements

15 January, 2014

New patterns

  • Charts have been added for all your graphing and reporting needs

  • Colors have been reworked with some new additions and less description text to read

  • Typeahead now uses the AUI Select2 control and less description text to read

  • Modal dialogs page rewritten with new call out example style and the code is now using the dialog2 API from AUI

  • Date formats have been included for relative and absolute dates

  • Copy to clipboard implemented for colors and iconography

Updates and bug fixes

  • Upgraded to AUI 5.4 with documentation link updates

  • Downloads were updated including a PSD GUI (v1.1) along with color swatches and layer styles

  • Tables description text cleaned up and ‘more’ icon used instead of the cog for row actions

  • Writing styles has been completely rewritten

  • Keyboard shortcuts moved out of foundations and into controls

  • Icon font is now available for download

  • URLs are now pretty without the .html extension

  • Automatically generated sitemap added for SEO

26 July, 2013

New patterns

  • Email guidelines for making product notifications

  • Downloads were added including a PSD GUI along with color swatches and layer styles for your Photoshop needs

  • Progress indicators containing spinners, determinate and indeterminate load patterns

  • Application switcher added to the header for easy navigation between AUI Docs and the AUI Sandbox

Updates and bug fixes

  • Upgraded to AUI 5.2 with documentation link updates

  • Icon font - now contains 77 icons

  • Tables - editable tables added, clean up of existing content and compact buttons added correctly

  • 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 was updated to include split buttons in application headers

  • Mentions was given a freshen up with retina examples

30 May, 2013

We launched a heap of new patterns and guidelines with this release. There have been some guideline re-writes and bug fixes as well.

New patterns

  • Pagination

  • Badges

  • Comments

  • Reveal text

  • Feature discovery

  • Tables - we’ve updated so much of it, it’s like they’re brand new

  • Login

  • Icon font - now contains 50 icons and has been moved to a private use unicode range

Updates and bug fixes

  • Upgraded to AUI 5.2-m3

  • Split buttons added to buttons guideline

  • Typography page now shows pixel values

  • Info message background updated via AUI

  • Vertical navigation guidelines completely rewritten

  • html5shim added for better IE8 support though not actively testing on that browser

  • Writing and language guidelines completely rewritten

  • Footer extended to now include the full Atlassian logo

  • Issue type icons updated to match JIRA 6

  • Application header was updated to include Bamboo, FishEye and Crucible headers

  • Added subtle colors to existing color palette

25 February, 2013

Initial public release of the ADG.