The Australian Government coat of Arms

Communities of practice

Communities of practice

Colour System

core

#1

Hey all. I thought I would share a quick mock-up/draft I did not long ago to test how the colour-system is intended to work.

It’s a really difficult thing to explain well on our docs site – and I’d been trying to work out how – but the idea is that if components are built using semantic colour variables ($AU-color-foreground-text rather than $au-primary or $teal) and use the inbuilt functions, than the components become themeable for any agency’s branding and much more shareable.

Example:

You can see how we do this in the Design System, changing the default palette to the DTA palette in _colors.scss which is loaded before auds.

If anyone is trying out theming with the colour-system I’d be super keen to hear your feedback.