50
100
200
300
400
500
600
700
800
900 ★
950
xx-neutral  →  var(--brand-neutral) →  var(--neutral-900)
50
100
200
300
400
500
600 ★
700
800
900
950
xx-primary  →  var(--brand-primary) →  var(--primary-600)
50
100
200
300
400
500 ★
600
700
800
900
950
xx-secondary  →  var(--brand-secondary) →  var(--secondary-500)
50
100
200
300
400
500 ★
600
700
800
900
950
xx-success  →  var(--brand-success) →  var(--success-500)
50
100
200
300
400
500
600 ★
700
800
900
950
xx-error  →  var(--brand-error) →  var(--error-500)
50
100
200
300
400
500 ★
600
700
800
900
950
xx-warning  →  var(--brand-warning) →  var(--warning-500)
50
100
200
300
400 ★
500
600
700
800
900
950
xx-info  →  var(--brand-info) →  var(--info-400)