Foundations are the visual elements needed to create engaging end-to-end user experiences. This includes guidance on iconography, typography, layout and structure.
Accessible design lets people of all abilities interact with, understand, and navigate our products.
Color distinguishes our brand and helps us create consistent experiences across products.
Color distinguishes our brand and reinforces consistent experiences across products.
Design tokens are a single source of truth to name and store design decisions for Atlassian product experiences.
Design tokens (beta)
Elevations are layered surfaces that form the foundation of UI.
The grid is the foundation for positioning elements onscreen. Designing to the grid helps create seamless, easy to follow experiences.
Icons are visual representations of commands, devices, directories, or common actions.
Illustrations help convey complex ideas in a simple way. They should be meaningful and reflect a user's context and emotional state.
Our brand and product logos are clear, impactful and recognizable. All carry our simple blue and white color palette with design variations.
Typography is our system of fonts. Each font conveys the appropriate sentiment to assist our users through each stage of their journey.