Skip to content
Switch branches/tags
Go to file
Cannot retrieve contributors at this time

The core module all components modules depend on.



yarn add
npm install

back to top


back to top



Get the contrast ratio of two colors and warn when it is below WCAG 2.0 AA standard 4.5:1

AU-color-contrast( foreground, background, silent, rounded )

The paramaters are:

foreground - Color one

background - Color two

silent - If the logs get printed in the terminal

rounded - If the value is rounded or not


content: AU-color-contrast( red, blue );


The function to find the nearest accessible color.

AU-color-a11y( toMakeA11y, background, ratioKey, steps )

The paramaters are:

toMakeA11y - The color that is to be changed.

background - The background color to compare against toMakeA11y for the contrast.

ratioKey - The keyword small or large to set the WCAG 2.1 contrast ration or 3.0 or 4.5.

steps - The step size our function is searching for a new color in. The bigger the number the faster the process the rougher the found color. Must be from 0.1 to 100.


background: AU-color-a11y( red, blue );


Generate an optimized SVG data-uri.

AU-svguri( svg )

The paramaters are:

svg - The SVG data to be converted.


background-image: AU-svguri('<svg xmlns="" width="20" height="20" viewBox="0 0 128 128">
  <path fill="red" d="M128 64l-64 64-16-16 64-64"/>
  <path fill="red" d="M128 64l-16 16-64-64L64 0"/>


Create media queries and wraps the @content code inside of it.

AU-media( breakpoint )

The paramaters are:

breakpoint - Either one of the following keywords: xs, sm, md, lg


@include AU-media( sm ) {
  width: 48%;


Mixin for setting font-size and line-height that snaps to the grid.

AU-fontgrid( fontsize, lineheight )

The paramaters are:

fontsize - Either one of the following keywords: xs, sm, md, lg, xl, xxl, xxxl.

lineheight - Either one of the following keywords: heading, nospace, default.


@include AU-fontgrid( md, heading );


Mixin for setting a properties value to snap to the grid, with a fallback for REM.

AU-space( property, value )

The paramaters are:

property - The css property to apply the spacing ( padding, margin, border )

value - The values of the property ( 0, 20px, 1unit, 5% )


@include AU-space( margin, 1unit 10% );


Add the outline to focus.

AU-focus( dark )

The paramaters are:

theme - Either one of the following keywords: light or dark.


@include AU-focus();


Hide an element from the screen but not a screen reader.



@include AU-sronly();


Clearing floats.



@include AU-clearfix();

back to top

Dependency graph


back to top


The visual test:

back to top

Release History

  • v4.0.0 - Added new breakpoints for xl (extra large) and also xs (extra small)
  • v3.4.2 - Remove --save-dev flag from readme instructions
  • v3.4.1 - Add two new colours: hint-text and hint-text-alt.
  • v3.4.0 - Update error and success alert colours to meet contrast requirements on --alt backgrounds
  • v3.3.0 - Change error and success alert colours to make them WCAG contrast requirements
  • v3.2.0 - Add additional colour checks for incaccesble color combinations
  • v3.1.2 - Removed uikit references
  • v3.1.1 - Fix issue with A11yColor when white and black both pass
  • v3.1.0 - Update font stack to accomodate linux users
  • v3.0.3 - Update dependencies
  • v3.0.2 - Removing web pack dev server, updating dependencies
  • v3.0.1 - Focus outline offset to only apply on the default focus state, build scripts for Windows
  • v3.0.0 - Binary search a11y color, replace node-sass with sass
  • v2.0.3 - Change npm run watch browser-sync location
  • v2.0.2 - Update dependencies
  • v2.0.1 - Change homepage link
  • v2.0.0 - Change to focus colour and border/muted color mix
  • v1.0.2 - Changing mix values for border and muted, focus colour, adding offset to focus
  • v1.0.1 - Adjusting how colors are generated from other colors
  • v1.0.0 - Moved to AU namespace, added new color themes and spacing
  • v0.1.3 - Moved to System fonts
  • v0.1.2 - Fixed newly introduced auds-svguri bug; ups
  • v0.1.1 - Fixed auds-svguri bug
  • v0.1.0 - 馃挜 Initial version

back to top


Copyright (c) Commonwealth of Australia. Licensed under MIT.

back to top