Colors

Token	Value	Demo
`$black`	#403F41
`$blackOpacity`	rgba(64, 63, 65, 0.2)
`$white`	#fff
`$pinkForWhite`	#E6007C
`$blueLight`	#E4F4FB
`$blueForWhite`	#007CAD
`$blueForBlack`	#00B6FF
`$greenForWhite`	#32841A
`$greenForBlack`	#4BC427
`$redForWhite` and `$redForBlueLight`	#D91714
`$amber`	#FFC037

Accessible pairings

As the names suggest, the “forWhite” colors can be safely paired with $white and the “forBlack” colors can be safely paired with $black. For example:

.ds-my-component {
  color: $white;
  background-color: $greenForWhite;
}

.ds-my-component-reversed {
  color: $greenForWhite;
  background-color: $white;
}

The is no $pinkForBlack because we tried to make one and it looked gross.